Sujet Précédent Sujet Suivant

Cache d'une liste déroulante lors du clique sur une autre (HTML)

Fermé
coastlyne - 7 mars 2013 à 11:34
 coastlyne - 8 mars 2013 à 14:45
Bonjour,

J'ai créé en Html 2 boutons (fruits et légumes) qui lors du clique de l'un une liste déroulante apparaît et pareil pour l'autre.
Cependant j'aimerais trouver un système permettant au clique de l'un ou l'autre, que la liste de l'autre se ré-enroule:

<html>
<head>
<script>
function visibilite(thingId)
{
var targetElement = document.getElementById(thingId) ;
if (targetElement.style.display == "none")
{targetElement.style.display = "" ;}
else {targetElement.style.display = "none" ;}
}
</script>
</head>
<body>
<div>
<b>
<a href="javascript:visibilite('id_div_1');">Légumes</a>
</b>
</div>
<div id="id_div_1" style="display:none;">
<a href="http://www.monsite.com/haricots" >haricots</a>
<br/>
<a href="http://www.monsite.com/courgettes" >courgettes</a>
</div>
<br/>
<div>
<b>
<a href="javascript:visibilite('id_div_2') ;">
Fruits
</a>
</b>
</div>
<div id="id_div_2" style="display:none;">
<a href="http://www.monsite.com/kiwi" >kiwi</a>
<br/>
<a href="http://www.monsite.com/bananes" >bananes</a>
</div>

</body>
</html>

Merci d'avance.
A voir également:

3 réponses

Réponse 1 / 3
JUG
7 mars 2013 à 12:48
Bonjour, le mieux pour ça est d'utiliser le DOM JavaScript.

Le DOM JavaScript permet de cibler un élément de la page pour changer ses paramètres, son contenu ou son état.
L'état se réfère à l'utilisation principale de JavaScript pour les pages web: La programmation dite événementielle.
Un événement est une action (souvent de l'utilisateur) qui va provoquer quelque chose:
appuyer un bouton, dérouler une liste, déplacer la souris... etc

Pour le principe il faut dire : quand j'appuie sur cette liste il faut masquer(je veut dire enlever la partie déroulante) l'autre.
Si celle ci n'est pas déroulée il ne se passera rien bien sûr.

Mettez ce script sur chaque bouton(le ciblage de la liste changera) et le tour est joué.

De cette façon vous avez votre résultat sans avoir de rechargement de page.
0
Réponse 2 / 3
coastlyne
7 mars 2013 à 13:21
Merci beaucoup mais le problème c'est que je ne connais pas du tout le javascript :s
Y a-t-il un exemple que je pourrais trouver ou qui pourrait m'aider ?

Merci
0
Réponse 3 / 3
coastlyne
8 mars 2013 à 14:45
Y'aurait-il une solution ??

Mercii
0

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?
Raven -
bonjou -

9 réponses
Suppression listes déroulantes
Archa -
Sam -

5 réponses
Lien phishing android
mcafferty -
mcafferty -

8 réponses
Changer la couleur de fond d'un en-tête
Adamantine -
Adamantine -

2 réponses
liste de noms par ordre alphabétique
alma -
alma13 -

23 réponses