Select javascript probleme d'affichage

[Résolu]
Signaler
Messages postés
11
Date d'inscription
mercredi 10 octobre 2007
Statut
Membre
Dernière intervention
21 juillet 2010
-
Messages postés
11
Date d'inscription
mercredi 10 octobre 2007
Statut
Membre
Dernière intervention
21 juillet 2010
-
Bonjour

Je viens poser ma question ici , en espérant que j'aurais une réponse. Je suis tout nouveau en javascript et j'ai un petit problème . J'ai créer des menu select sur ma page html , que j'ai personnalisé grâce a javascript . A mes selects j'ai rajouté pour certain une scrollbar directement avec le css (overflow:auto) .Maintenant j'ai mis chacun de mes select dans une div differentes pour chacun . Les un en dessous des autres, En definissant une hauteur suffisante pour quel puisse afficher le contenu du select . Mais lorsque que je clique sur un select celui se deroule derrière les autres selects . Par exemple en prenant le code ci dessous , lorsque je clique sur menu deroulant 1 , son contenu (commercial,rooms,... ,)s'affiche derrière mon menu deroulant 2. J'ai mis mes div en absolue et essayer de joué avec le z-index mais rien y fait . Quel peut-il m'aider . Merci beaucoup.






Menu deroulant 1
Commercial
Rooms
Short-term














Menu deroulant 2
Apartment
Flat
House
Other
Site
Studio/Bedsit






// = 0) {
selectMe(ul.childNodes[this.prev]);
}
break;
// next
case 39: // right
case 40: // down
if (this.next < ul.childNodes.length) {
selectMe(ul.childNodes[this.next]);
}
break;
// goto the beginning of the list
case 33: // page up
case 36: // home
selectMe(ul.firstChild);
break;
// goto the end of the list
case 34: // page down
case 35: // end
selectMe(ul.lastChild);
break;
}
};
obj.parentNode.insertBefore(ul, obj);
}
function selectMe(obj) {
var lis = obj.parentNode.getElementsByTagName('li');
for (var i = 0; i < lis.length; i++) {
if (lis[i] != obj) {
lis[i].className = '';
lis[i].onclick = function () {
selectMe(this);
};
} else {
setVal(obj.selectID, obj.selIndex);
obj.className = 'selected';
obj.parentNode.className =
obj.parentNode.className.replace(new RegExp(" selectOpen\\b"), '');
obj.onclick = function () {
obj.parentNode.className += ' selectOpen';
this.onclick = function () {
selectMe(this);
};
};
}
}
}
function setVal(objID, val) {
var obj = document.getElementById(objID);
obj.selectedIndex = val;
}
function setForm() {
var s = document.getElementsByTagName('select');
for (var i = 0; i < s.length; i++) {
selectReplacement(s[i]);
}
}
window.onload = function () {
(document.all && !window.print) ? null : setForm();
};


J'ai directement pris le code sur une source pour le java , peut être que c'est de la que viens le problème.

6 réponses

Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Bonjour,
je ne voyais pas cela comme ça mais plutôt en partant du script de ton premier post, un truc du style
var MaxIndex = 1000; // zIndex a top en global ici
function selectReplacement(obj) {
    obj.className += ' replaced';
    var ul = document.createElement('ul');
    ul.className = 'selectReplacement';
    ul.style.zIndex = MaxIndex--; // affectation puis decrementation pour suivant
//...le reste du code

;O)
Messages postés
6414
Date d'inscription
mardi 8 mars 2005
Statut
Modérateur
Dernière intervention
29 juillet 2020
360
Il faut que tu poses ta question sur le forum javascript
Messages postés
15814
Date d'inscription
jeudi 8 août 2002
Statut
Modérateur
Dernière intervention
4 mars 2013
125
Salut,

Oui tu es ici sur le forum java et non javascript : ce sont deux langages qui n'ont pas grand chose en commun si ce n'est le mot java.

Je déplace vers le forum javascript.
______________________________________

AVANT de poster votre message, veuillez lire, comprendre, et appliquer notre réglement
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Bonjour,
j'ai mis mes div en absolue et essayer de joué avec le z-index mais rien y fait
d'après ce que je vois ce n'est pas sur les DIVs qu'il faut mettre le z-Index mais sur les ULs, le DIV ne s'étirant pas.
;O)
Messages postés
11
Date d'inscription
mercredi 10 octobre 2007
Statut
Membre
Dernière intervention
21 juillet 2010

Bonjour , dsl pour l'erreur de forum

j'ai autrement essayer les Uls , mais je vois pas bien la différence , car je dois quand meme définir une taille a mes ULs et une position .








Menu deroulant 1
Commercial
Rooms
Short-term










Property Type
Apartment
Flat
House
Other
Site
Studio/Bedsit









Select County
Antrim
Armagh
Carlow
Cavan
Clare
Cork
Derry
Donegal
Down
Dublin
Fermanagh
Galway









#col3
{position: relative;
z-index: auto;
width: 262px;
height: 445px;
text-align: left;
float: left;
background-image: url('../images/home_05.jpg');
background-repeat: no-repeat}

#ul1
{ z-index: 3000;
position: absolute;
top: 125px;
left: -30px;}

#ul2
{ z-index: 2999;
position: absolute;
top: 160px;
overflow: auto;
height: 100px;
width: 230px;
left: -30px;}

#ul3
{ z-index: 2998;
position: absolute;
top: 200px;
overflow: auto;
height: 100px;
width: 230px;
left: -30px;}

pour les 2 premiers menus (Ul1 et Ul2) sa marche , mais pas pour le 3ème , celui ci ne veut pas se dérouler .Je comprends pas . Merci de votre aide
Messages postés
11
Date d'inscription
mercredi 10 octobre 2007
Statut
Membre
Dernière intervention
21 juillet 2010

Super sa marche nickel maintenant , merci bcp.