• Loneci

    Ce montage du 21 septembre, repris en 800x600px; pour cela, j'ai utilisé 6 images déjà hébergées sur Ekla, en 800x450px: vos images en 800x600px les remplaceront.
    Vous ajustez la hauteur des images en fonction de leur nombre.
    Survolez les tranches.

    " alt="" />

    <div style="width:800px; height:600px; margin: 0px auto;">
    <img id="g1" src="http://ekladata.com/EkZkPU8gdQ27ENS7wwHOe48SE-I.jpg" alt="" />
    <img id="g2" src="http://ekladata.com/Zn4iUXw9ea2tVzsUnSlkN1UxlIw.jpg" alt="" />
    <img id="g3" src="http://ekladata.com/KhIyJfOB5gwxWIm5xxJZZs_Rd6c.jpg" alt="" />
    <img id="g4" src="http://ekladata.com/IChlbW26PObjdiTP5foOd_1OJVU.jpg" alt="" />
    <img id="g5" src="http://ekladata.com/iMisU5-3PM_ge32enfCkXBKKVP0.jpg" alt="" />
    <img id="g6" src="http://ekladata.com/1qbCsTr_cI-jAuTGmIhy8SmCp2U.jpg" alt="" />
    " alt="" />
    </div>
    <style><!--
    #g1{position:absolute; z-index:1; width:800px; height:60px; transition:all 1s linear; margin:0 0 0 0;}
    #g2{position:absolute; z-index:1; width:800px; height:60px; transition:all 1s linear; margin:70px 0 0 0;}
    #g3{position:absolute; z-index:1; width:800px; height:60px; transition:all 1s linear; margin:140px 0 0 0;}
    #g4{position:absolute; z-index:1; width:800px; height:60px; transition:all 1s linear; margin:210px 0 0 0;}
    #g5{position:absolute; z-index:1; width:800px; height:60px; transition:all 1s linear; margin:280px 0 0 0;}
    #g6{position:absolute; z-index:1; width:800px; height:60px; transition:all 1s linear; margin:350px 0 0 0;}
    #g1:hover,#g2:hover, #g3:hover,#g4:hover, #g5:hover, #g6:hover{z-index:5; height:450px;margin:0 0 0 0;}
    --></style>