Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

Sujet : menu déroulant sur image [ CSS / Général ] (JackNUMBER)

dimanche 18 mars 2007 à 15:59:09 | menu déroulant sur image

JackNUMBER


bonjour !
Je cherche un moyen de faire un menu qui se déroule lors du survol d'une image, si possible avec une image map.

en gros mon menu sera une image (menu.jpg), avec des zones réactives et lors du survol d'une de ces zones, un menu se apparait (en dessous). Ce menu (enfin, cette image) pourra être placé(e) n'importe où sur la page, donc pas de position absolue.

voilà !
j'ai beaucoup cherché et je n'ai pas trouvé.

merciiii


-----------------------------------------

Jack NUMBER  

dimanche 18 mars 2007 à 16:03:29 | Re : menu déroulant sur image

stfou

Membre Club
Bonjour,

<div id="menu" style="position:relative;diplay:none">le code de ton menu</div>
<img name="ton image" onmouseon="document.getElementById('menu').style.display='';" onmouseout="document.getElementById('menu').style.display='none';"


Le travail n'a jamais tué personne, mais pourquoi prendre le rique ?


dimanche 18 mars 2007 à 16:09:04 | Re : menu déroulant sur image

JackNUMBER


ha super !! merci
juste: tu n'as pas fermé ta balise img (> à la fin du code)
et le menu s'affiche avant que je ne le suvole, il fodrait faire en sorte que lors du chargement de la page, il se cache.

merci encore pour cette réponse si rapide.


-----------------------------------------

Jack NUMBER  

dimanche 18 mars 2007 à 16:10:13 | Re : menu déroulant sur image

JackNUMBER


ha, aussi, le menu ne s'affiche pas lors du survol..................


-----------------------------------------

Jack NUMBER  

dimanche 18 mars 2007 à 16:31:13 | Re : menu déroulant sur image

JackNUMBER


ha aussi, lorsque je vais sur le menu bah.......... il disparait puisque je suis en dehors de l'image.



-----------------------------------------

Jack NUMBER 

dimanche 18 mars 2007 à 16:32:10 | Re : menu déroulant sur image

stfou

Membre Club
Bonjour,
faute de frappe display:none et non pas diplay:none
et c'est onmouseover.
lol c'est pas mon jour moi


Le travail n'a jamais tué personne, mais pourquoi prendre le rique ?


dimanche 18 mars 2007 à 16:33:35 | Re : menu déroulant sur image

stfou

Membre Club
donc je refais le code lol :
<div id="menu" style="position:relative;display:none">le code de ton menu</div>
<img name="ton image" onmouseover="document.getElementById('menu').style.display='';" onmouseout="document.getElementById('menu').style.display='none';">



Le travail n'a jamais tué personne, mais pourquoi prendre le rique ?


dimanche 18 mars 2007 à 18:00:16 | Re : menu déroulant sur image

JackNUMBER

ouaiiiii !!
merci
et y orait-il un moyen de faire apparaitre le menu comme un calque par dessus la page et en dessous de l'image
ça serait top !

merci


-----------------------------------------

Jack NUMBER  

dimanche 18 mars 2007 à 18:17:39 | Re : menu déroulant sur image

stfou

Membre Club
Bonjour,
Oui,

<script>
function show(object,state)
{
var menu=document.getElementById("menu");
if(state=="on")
{
menu.style.display="";
menu.style.top=object.offsetTop;
menu.style.left=object.offsetTop;
}
else
{
menu.style.display="none";
menu.style.top=0;
menu.style.left=0;
}
}
</script>
<div id="menu" style="position:absolute;top:0;left:0;display:none;">cod du menu</div>
<img onmouseover="show(this,'on')" onmouseout="show(this,'off')" src="img.jpg" name="img1">
<img onmouseover="show(this,'on')" onmouseout="show(this,'off')" src="img.jpg" name="img2">
<img onmouseover="show(this,'on')" onmouseout="show(this,'off')" src="img.jpg" name="img3">



Le travail n'a jamais tué personne, mais pourquoi prendre le rique ?


dimanche 18 mars 2007 à 18:47:41 | Re : menu déroulant sur image

JackNUMBER


GÉNIAL !
juste un petit détail, comment faire pour que le menu affiché ne clignote pas lors du mouvement de la souris (sans doute dût au scrit qui le cache en dehors de l'image)

arpès ça sera parfait !!!


-----------------------------------------

Jack NUMBER  


1 2

Cette discussion est classé dans : menu, image, zones, déroulant, survol


Répondre à ce message

Sujets en rapport avec ce message

Menu déroulant>>>>Image [ par wemacl ] Bonjour,je débute en javascript...Comment afficher une image (Pas en pop up), choisie dans un menu déroulantMerci d'avance,Claudy Menu déroulant bug texte ou image défilante [ par lebeef ] Bonjour à toutes et à tous,J'ai créé un petit site (ce n'est pas de la pub www.univie.ch ). Comme vous pouvez le voir, j'ai fait un menu déroulant en menu déroulant [ par eteasdale ] Voici mon problème.Je dois fabriquer 5 menus déroulants ayant des informations différente (ex.:menu1. sorte d'automobile - menu2. couleur - menu3. ann apparaitre calque à partir d'un menu déroulant [ par karenma ] bonjour je souhaite faire apparaitre un calque à partir d'éléments de mon menu déroulant par exemple essai et immo Comment faire ?Merci d'avance pour menu tout simple [ par wireless12 ] Bonjours à tous, Je suis à la recherche de mon menu idéal ! Malheureusement je n'arrive pas à le créer (même si dans ma tête je vois exactement ce que cacher menu déroulant [ par ndubien ] Bonjour,Comment faire disparaître (cacher) mon menu déroulant, lorsque la souris n'est ni dessus le menu ni sur le bouton?cf. http://fansdautomobiles. Menu Déroulant Ajax [ par Catalarem ] Alors ben tout d'abord un grand merci à cette fabuleuse communauté qui je le sens (depuis que je me suis enfin convaincu moi même que le bon vieux HTM menu déroulant dynamique [ par tazegue ] Salut.J'ai créé une page avec 2 formulaires : un text-box et un menu déroulant.je voudrais que le contenu du menu déroulant change en fonction de ce q menu déroulant [ par ndubien ] Bonjour, Comment faire pour que mes menus déroulants passe devant le contenu de la page?Voici ma page (temporaire)  <a href="http://fansdautomob menu déroulant css+js+php et lien actif [ par poucinette51 ] Bonjour,J'ai un menu déroulant de ce style :


Nos sponsors

Sondage...

CalendriCode

Juillet 2009
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
2728293031  

Consulter la suite du CalendriCode

Téléchargements

Logiciels à télécharger sur le même thème :

Comparez les prix Nouvelle version


HTC G1

Entre 449€ et 449€


Photothèque Nouveau !



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,296 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.