• Montage 34

    Clic maintenu sur chaque vignette.
    Remplacez mes adresses images en bleu par les vôtres.

     

     

     

     

     

     

     

     

     

     


    <div style="width: 60vw; height: 33.75vw; margin: 1vh auto; background: url('http://ekladata.com/sWCa3ZyWqf1WsBwPXwUY-2VcWwc.jpg'); background-size: cover; border: 0.1vh solid black;">
    <p id="vg1" class="vg">&nbsp;</p>
    <p id="vg2" class="vg">&nbsp;</p>
    <p id="vg3" class="vg">&nbsp;</p>
    <p id="vg4" class="vg">&nbsp;</p>
    <p id="vg5" class="vg">&nbsp;</p>
    <p id="vg6" class="vg">&nbsp;</p>
    <p id="vg7" class="vg">&nbsp;</p>
    <p id="vg8" class="vg">&nbsp;</p>
    <p id="vg9" class="vg">&nbsp;</p>
    <p id="vg10" class="vg">&nbsp;</p>
    </div>

    <style><!--
    .vg{position:absolute; z-index:1; width:8vw; height:4.5vw; border:0.4vh solid white; box-shadow:0.4vh 0.4vh 0.6vh black; border-radius:50%;transform:translate(0vw,0vw) rotatey(180deg); transition:transform 1s linear 0s, width 1s linear 1s, height 1s linear 1s,box-shadow 1s linear 1s, margin 1s linear 1s, border-radius 1s linear 2s;}
    #vg1{background:url('http://ekladata.com/uFkczq0_R-LNz53gRbDpBbXBlzw.jpg'); background-size:cover; transform-origin:50% 50%; margin: 2vw 0 0 2vw;}
    #vg2{background:url('http://ekladata.com/6xA673TA50OYovsrwQLf2_m-NUo.jpg'); background-size:cover; transform-origin:50% 50%; margin: 8vw 0 0 2vw;}
    #vg3{background:url('http://ekladata.com/IYSn_hMH-oXMqmeKin8l9IDYO0E.jpg'); background-size:cover; transform-origin:50% 50%; margin: 14vw 0 0 2vw;}
    #vg4{background:url('http://ekladata.com/M_zRAienDaoh8vGZg3G1hOOkiCQ.jpg'); background-size:cover; transform-origin:50% 50%; margin: 20vw 0 0 2vw;}
    #vg5{background:url('http://ekladata.com/DssXDbF2gyNvYQVAEiHf4-n4xvg.jpg'); background-size:cover; transform-origin:50% 50%; margin: 26vw 0 0 2vw;}
    #vg6{background:url('http://ekladata.com/mJaUbzimkEJ2zestDk3IFWsJKqI.jpg'); background-size:cover; transform-origin:50% 50%; margin: 2vw 0 0 50vw;}
    #vg7{background:url('http://ekladata.com/46BDe82LhwNPKuuKEXJ34J78mME.jpg'); background-size:cover; transform-origin:50% 50%; margin: 8vw 0 0 50vw;}
    #vg8{background:url('http://ekladata.com/BqgeyGPnti4NjUSOAZffN6yvuTg.jpg'); background-size:cover; transform-origin:50% 50%; margin: 14vw 0 0 50vw;}
    #vg9{background:url('http://ekladata.com/Xl8AgOfIaoiiTrWlA0pq-SxfGnI.jpg'); background-size:cover; transform-origin:50% 50%; margin: 20vw 0 0 50vw;}
    #vg10{background:url('http://ekladata.com/ArjeOX8ylzqX0pFQ9DCljNvkgGM.jpg'); background-size:cover; transform-origin:50% 50%; margin: 26vw 0 0 50vw;}
    #vg1:active,#vg2:active,#vg3:active,#vg4:active,#vg5:active,#vg6:active,#vg7:active,#vg8:active,#vg9:active,#vg10:active{z-index:10;width:60vw; height:33.75vw; border-radius:0%; transform:translate(0vw,0vw) rotatey(0deg); margin:0 0 0 0; border:none; box-shadow:none;}
    --></style>