• Montage 1

    Pour utiliser des photos de janvier 2018, je vous propose des montages, certainement déjà proposés ... désolé !

    L'agrandissement des photos se fait au clic gauche maintenu; mes photos, au ratio 16/9, sont hébergées en 1536x864px, 80% de mon écran 1920x1080px, afin d'en réduire le poids.

    Cependant, vous pouvez remplacer mes adresses image par les vôtres, quelles que soient leur dimension; le code les adapte.

    Le montage publié est en 80% (80vw) de l'écran de lecture mais le code est en 60% (60vw), plus adapté à la plupart des blogs.

     

     

     

     

     

     

     

     

     

     

     

     

    <div style="width:60vw; height:33.75vw; margin:1vh auto; border:0.6vh ridge white;">
    <p id="p1" class="par">&nbsp;</p>
    <p id="p2" class="par">&nbsp;</p>
    <p id="p3" class="par">&nbsp;</p>
    <p id="p4" class="par">&nbsp;</p>
    <p id="p5" class="par">&nbsp;</p>
    <p id="p6" class="par">&nbsp;</p>
    <p id="p7" class="par">&nbsp;</p>
    <p id="p8" class="par">&nbsp;</p>
    <p id="p9" class="par">&nbsp;</p>
    </div>
    <style><!--
    .par{position:absolute; z-index:1; width:19.5vw; height:11vw; border:0.25vw solid white; transition:all 1s linear;}
    #p1{transform:translate(0vw,0vw); background:url('http://ekladata.com/RcgUwvOXOd2_QnlVV94818Rnsnw.jpg'); background-size:cover;}
    #p2{transform:translate(20vw,0vw); background:url('http://ekladata.com/Jui7dYCGP_iO1cSwlhXt0YBpPYc.jpg'); background-size:cover;}
    #p3{transform:translate(40vw,0vw); background:url('http://ekladata.com/SuSmv7YcoY_S3GscEmXGDtP5PlA.jpg'); background-size:cover;}
    #p4{transform:translate(0vw,11.25vw); background:url('http://ekladata.com/4REeUr6dvKISQ9gyFAy0xlbVC_E.jpg'); background-size:cover;}
    #p5{transform:translate(20vw,11.25vw); background:url('http://ekladata.com/MWboECislH0_K6cUjMI8kgoCo98.jpg'); background-size:cover;}
    #p6{transform:translate(40vw,11.25vw); background:url('http://ekladata.com/q4zMn61qS7OL6THnBWjQf9-j9Nc.jpg'); background-size:cover;}
    #p7{transform:translate(0vw,22.5vw); background:url('http://ekladata.com/L2z5DTS0FQIiHa7sNxcqBUFUNeo.jpg'); background-size:cover;}
    #p8{transform:translate(20vw,22.5vw); background:url('http://ekladata.com/McXRy-3b1ysZkr54oZRaA3Omi8I.jpg'); background-size:cover;}
    #p9{transform:translate(40vw,22.5vw); background:url('http://ekladata.com/ovc7UOytCwVl2aHtZouaTKobXfc.jpg'); background-size:cover;}
    #p1:active,#p2:active,#p3:active,#p4:active,#p5:active,#p6:active,#p7:active,#p8:active,#p9:active{z-index:10; width:60vw; height:33.75vw; border:none; transform:translate(0vw,0vw);}
    --></style>