Survol d'images

Résolu
Bonjour,
voilà je suis en train de créer un site et j'ai dreamweaver 8 et j'aimerais pouvoir mettre 4 images qui ce superpose légérement sur la même page et qu'au passge de ma souris elle mette en evidence celle-ci comme sur ce site :

http://www.reliure-magar.com/pages/reliure_d_art.html

je ne c'est pas comment faire si je fait images survolé je ne peux mettre que deux images.

merci
Configuration: Windows 7 / Firefox 3.5.7

7 réponses

  1. As tu regardé dans les sources de la pages??
    il y a du javascript pour le survol et des css pour le positionnement des images
    1. bon apparament il y a du javascript que je ne maitrise pas , j'aimerais juste savoir si l'on peut le faire en mode création qui est bien plus simple pour moi
      1. c'est quoi ce mode creation??..c'est dans Dreamweaver?? alors la c'est moi qui maitrise pas :o)
        1. ben au lieu de taper du code tu créer tes pages par des menus et différent click
          1. tu met chaque image dans un div, tu attribut un z-index pour chaque div (mettons de 1 à 5) et pour chaque div tu cré un css du genre
            div1:hover {
            z-index:6; //tu donne le z-index le plus élevé
            }
            A tester bien sur !
            1. il n'y as pas un truc plus simple du genre je met quatre photos légérement empillé puis je leurs specifie de ce mettre en premier plan lorsque l'on passe la souris dessus, car là j'avoue que aprés mettre une image dans un div aprés je ne sais pas faire
              1. z-index sert précisément à spécifier à quel plan appartient la photo !
                Voila un ptit bout de code, test le en modifiant le src des images

                <style>
                #div1 {
                position:absolute;
                left:100px;
                top:100px;
                z-index:1;
                }
                #div2 {
                position:absolute;
                left:300px;
                top:150px;
                z-index:2;
                }
                #div3 {
                position:absolute;
                left:200px;
                top:200px;
                z-index:3;
                }
                #div1:hover {
                z-index:4;
                }
                #div2:hover {
                z-index:4;
                }
                #div3:hover {
                z-index:4;
                }
                </style>

                <div id=div1>
                <img src="/valeo.jpg" width="400px" />
                </div>

                <div id=div2>
                <img src="/valeo.jpg" width="400px" />
                </div>

                <div id=div3>
                <img src="/valeo.jpg" width="400px" />
                </div>
                1. ohhh
                  super il est impec ce code est fonctionne trés bien je te remercie beaucoup bloodchecker
                  je vais mettre ça en oeuvre, il me reste qu'a changer le fichier source et l'emplacement des balises.
                  merci