• Art.15.7.21

    6 images au ratio 16/9.

    Il pleut ! Survol de chaque goutte.

     

     

     

     

     

     

    *******************
    <div style="width: 1000px; height: 562px; margin: 20px auto; text-align: left;">
    <p id="pl0">Il pleut ! Survol de chaque goutte.</p>
    <p id="pl1" class="pl">&nbsp;</p>
    <p id="pl2" class="pl">&nbsp;</p>
    <p id="pl3" class="pl">&nbsp;</p>
    <p id="pl4" class="pl">&nbsp;</p>
    <p id="pl5" class="pl">&nbsp;</p>
    <p id="pl6" class="pl">&nbsp;</p>
    </div>
    <style><!--
    #pl0{position:absolute; z-index:1; width:300px; font-size:25px; transform:translate(280px,10px);}
    .pl{position:absolute; z-index:1; border-radius:0% 50% 50% 50%; transition:all 1s;}
    #pl1{width:170px; height:170px; background:url('http://ekladata.com/E_lokgC2i0V1PoKMx_Rj0sFgjPY@1000x562.jpg'); background-size:1000px 562px; background-position:-100px -20px; transform:translate(100px,20px);}
    #pl2{width:150px; height:150px; background:url('http://ekladata.com/gRVGq7YpWCz_8Yz9jEE5g_Cu73M@1000x562.jpg'); background-size:1000px 562px; background-position:-350px -150px; transform:translate(350px,150px);}
    #pl3{width:200px; height:200px; background:url('http://ekladata.com/in8eFyzrdaAxnRiC_pontkgoDvw@1000x562.jpg'); background-size:1000px 562px; background-position:-480px -300px; transform:translate(480px,300px);}
    #pl4{width:120px; height:120px; background:url('http://ekladata.com/OXyVj0kkci_YroiaQPx_ePzaqoY@1000x562.jpg'); background-size:1000px 562px; background-position:-620px -50px; transform:translate(620px,50px);}
    #pl5{width:190px; height:190px; background:url('http://ekladata.com/WrmqcgTWA07GufIyRuJ7hoG-XMY@1000x562.jpg'); background-size:1000px 562px; background-position:-120px -320px; transform:translate(120px,320px);}
    #pl6{width:200px; height:200px; background:url('http://ekladata.com/_W6G2c1aG3LDqR-gKWbNBxBR6V8@1000x562.jpg'); background-size:1000px 562px; background-position:-750px -220px; transform:translate(750px,220px);}
    #pl1:hover,#pl2:hover,#pl3:hover,#pl4:hover,#pl5:hover,#pl6:hover{z-index:5; width:1000px; height:562px; border-radius:0%; background-position:0px 0px; transform:translate(0px,0px);}
    --></style>