salsalera69 a écrit :
Bonsoir,
J'ai une image interactive : avec des zones area.
Lorsque la souris passe sur une zone (mouseover), je souhaite afficher un <div> avec des liens sous forme de liste.
Un peu comme ce que propose le site du Cismef sur le titre " Accès par type de ressources" : http://www.cismef.org/
J'ai trouvé des scripts en javascript mais aucun qui concerne une image interactive
Je suis preneuse de toute idée.
Merci,
Salsalera69.
|
Salut!
Je connais pas bien le javascript, qui serait en effet peut être plus performant dans ce cas là.
Par contre, je pense que tu peux jouer avec des propriétés css.
en html
Code :
- <div class="source">
- texte sur lequel il faut passer la souris
- </div>
- <div class="liens">
- <ul>
- <li>liens sous forme de liste</li>
- <li>liens sous forme de liste</li>
- <li>liens sous forme de liste</li>
- <li>liens sous forme de liste</li>
- </ul>
- </div>
|
La css associée :
Code :
- .liens
- {
- display: none; /* va cacher ta div */
- }
- .liens:hover
- {
- display: block; /* va la div en passant la souris devant */
- }
|
Après, il te suffit de bien régler la feuille de style pour faire apparaitre ta div là ou tu veux. À priori, si tu as plusieurs "sources" qui affichent chacune leurs "liens" au même endroit, tu peux jouer à coup de position: absolute et de z-index.
Message édité par lautrejojo le 17-12-2009 à 11:39:05
---------------
Question sur la programmation ? DevWeb it!