Bouton rollover ouvrant fenêtre pop up
Seph
-
Seph -
Seph -
Bonjour,
Je souhaiterai créer un bouton rollover (à base de 2 images petit format) ouvrant une fenêtre pop up contenant une troisième image (de plus grand format) ainsi qu'une brève description textuelle en dessous (ceci de multiples fois sur une page avec 3 images différentes à chaque fois).
Je travaille sous Dreamweaver CS4, c'est mon premier site et j'ai peu de connaissance en code.
Merci par avance.
Je souhaiterai créer un bouton rollover (à base de 2 images petit format) ouvrant une fenêtre pop up contenant une troisième image (de plus grand format) ainsi qu'une brève description textuelle en dessous (ceci de multiples fois sur une page avec 3 images différentes à chaque fois).
Je travaille sous Dreamweaver CS4, c'est mon premier site et j'ai peu de connaissance en code.
Merci par avance.
A voir également:
- Bouton rollover ouvrant fenêtre pop up
- Pop up mcafee - Accueil - Piratage
- Fenetre windows - Guide
- Bouton shift pc ✓ - Forum Jeux vidéo
- Réinitialiser freebox pop - Forum Freebox
- Pop corn time - Télécharger - TV & Vidéo
1 réponse
voici la solution:
<html>
<head>
</head>
<body>
<img src='imageDuBouton1.gif' name='nameBouton' onmouseover='afficherImageDuBouton2EtPopUp();' onmouseout='afficherImageDuBouton1();'>
<script language='javascript'>
function afficherImageDuBouton2EtPopUp()
{
document.nameBouton.src='imageDuBouton2.gif';
popUp=open('','','location=0');
popUp.document.write("<html><body><img src='imageNumero3.jpg'><br>Commentaire ...</body></html>");
}
function afficherImageDuBouton1()
{
document.nameBouton.src='imageDuBouton1.gif';
}
</script>
</body>
</html>
<html>
<head>
</head>
<body>
<img src='imageDuBouton1.gif' name='nameBouton' onmouseover='afficherImageDuBouton2EtPopUp();' onmouseout='afficherImageDuBouton1();'>
<script language='javascript'>
function afficherImageDuBouton2EtPopUp()
{
document.nameBouton.src='imageDuBouton2.gif';
popUp=open('','','location=0');
popUp.document.write("<html><body><img src='imageNumero3.jpg'><br>Commentaire ...</body></html>");
}
function afficherImageDuBouton1()
{
document.nameBouton.src='imageDuBouton1.gif';
}
</script>
</body>
</html>
Cependant je n'arrive pas a faire fonctionner ce script à moins de mettre la partie javascript dans l'head de la page html, mais dans ce cas, dès le survol de l'image que la fenêtre pop up apparait.
Que puis-je faire pour que la fenêtre pop up apparaisse seulement après un clique si le bouton/image rollover?
N'étant vraiment pas a l'aise en code, il est possible que je fasse complètement fausse route, dans ce cas, n'hésitez pas à me corriger.
Merci d'avance.
<html>
<head>
</head>
<body>
<a href='javascript:afficherPopUp();'><img src='imageDuBouton1.gif' name='nameBouton' onmouseover='afficherImageDuBouton2();' onmouseout='afficherImageDuBouton1();'></a>
<script language='javascript'>
function afficherPopUp()
{
popUp=open('','','location=0');
popUp.document.write("<html><body><img src='imageNumero3.jpg'><br>Commentaire ...</body></html>");
}
function afficherImageDuBouton2()
{
document.nameBouton.src='imageDuBouton2.gif';
}
function afficherImageDuBouton1()
{
document.nameBouton.src='imageDuBouton1.gif';
}
</script>
</body>
</html>
Néanmoins, ayant boutons de ce type de bouton avec 3 images a chaque fois (2 boutons + grande image pop up) dois-je recopier une fonction a chaque fois avec des noms différents?
De plus, est-il possible d'attribuer une taille à la fenêtre pop up?
Merci d'avance!