Si tu veux que quelque chose se passe lorsque tu cliques, il va falloir utiliser du JavaScript.
Tu peux y arriver assez simplement en ajoutant un attribut dans ton html sur les éléments qui t'interessent.
pour exemple, voilà ce que j'ai ajouté dans ton code ;
<ul>
//Devient :
<ul id="sous-menu" onclick="style.display = 'none'">
/* J'ajoute un ID à l'élément (utile plus tard)
Au clic sut l'élément, je change la valeur display à "none",
ce qui va cacher l'élément.
*/
//Ensuite je modifie la ligne précédente :
<a href="#!page-accueil" class="page-link-active">accueil</a>
//Qui devient :
<a href="#!page-accueil" onmouseover="document.getElementById('sous-menu').style.display = 'block'" class="page-link-active">accueil</a>
/* Au passage de la souris, je vais chercher l'élément avec l'ID que j'ai ajouté.
A cet élément je vais remodifier le display pour qu'il passe à "block" */
2)Commentaires CSS
Une simple remarque en plus, j'ai vu que dans ton CSS tu utilisais tes commentaires comme ceci:
/ commentaire /
Je ne sais pas si tu n'aura pas des problèmes avec cette notation que je ne connais pas. A toi de voir mais pour ma part je te dirais de les écrires plutot comme ceci :
/* commentaire */
Ou encore mieux, puisque c'est pour commenter une seule ligne :
// commentaire
Voilà, j'espère avoir pu t'aider.
Biensur il y a beaucoup d'autres façons de faire le JS (tu peux meme faire tout l'accordéon en JS ou jQuery et y ajouter des effets de lenteur au moment de l'ouverture/fermeture si tu veux)
Je te laisse chercher ce qui te convient le mieux.
Merci pour ta réponse, un élément m'échappe, car les informations qui se trouvent entre les balises <span> apparaissent comme du texte dans la page web.
Y a t'il d'autre éléments à insérer dans le code?
au sujet des commentaires, je n'avais pas prêté attention à cela en copiant le code, mais il y a bien /* dans mon code, merci pour ton attention.
Merci pour ta réponse, un élément m'échappe, car les informations qui se trouvent entre les balises <span> apparaissent comme du texte dans la page web.
Oups, ne prete pas attention à la balise span, elle n'est pas sensée être là. J'avais essayé de mettre en couleur les bouts de code que j'avais ajouté pour les faire ressortir mais ça ne fonctionne pas quand on le fait dans du code. J'avais remarqué mais ai oublié d'en retirer une apparemment. Toutes mes excuses.
effectivement ca fonctionne mieux sans la balise <span>, le menu se ferme bien mais ne se redéploie plus si on repasse la souris...
Si ça doit fonctionner, j'avais prévu ça normalement dans le code que je t'ai donné. Relis bien le commentaire que j'ai écrit (ligne 13/14).
Tu dois donner un ID à ton <ul> (ligne 3), puis sur le lien qui apparait constamment, tu ajoute un attribut "onmouseover" (ligne 12), c'est ici qu'au passage de la souris le menu doit se redéployer.
Oh ben j'avais pas bien lu les précédents messages.
On n'a pas du tout besoin de JS pour faire un menu déroulant Là, il faut se poser la question de pourquoi les href des liens contiennent "#!page1". C'est un site en une page et on va vers des ancres ?
Pas d'aide concernant le code par MP, le forum est là pour ça :)
Est-ce qu'on peut avoir une page en ligne pour comprendre ?
(parce que même si le code proposé par Anakinyo fonctionne, ce n'est pas très bien de mettre un onmouseover, on préfère externaliser le JS et utiliser des écouteurs, dans un souci de séparation du fond du comportement)
Pas d'aide concernant le code par MP, le forum est là pour ça :)
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
Pas d'aide concernant le code par MP, le forum est là pour ça :)
Le CSS ça peut craindre -->Conférence CSS3.CREATE
Pas d'aide concernant le code par MP, le forum est là pour ça :)
Pas d'aide concernant le code par MP, le forum est là pour ça :)
Pas d'aide concernant le code par MP, le forum est là pour ça :)