• Art.7.6.21

    8 images au ratio 16/9. Arrêt animation au survol.


    <div style="position: relative; overflow: hidden; width: 1000px; height: 562px; margin: 20px auto; border: 4px ridge white; box-shadow: 4px 4px 6px black; text-align: left; border-radius: 50px;">
    <p id="diapo"><img class="cond" src="http://ekladata.com/1QAE_L5lkA07YAvIB2db6WUTHbs@1000x562.jpg" alt="" /><img class="cond" src="http://ekladata.com/ojrOPeHZe0NiVuikSognoSau9oo@1000x562.jpg" alt="" /><img class="cond" src="http://ekladata.com/AsWs1cosuK9oQZwEehsxbBafpXg@1000x562.jpg" alt="" /><img class="cond" src="http://ekladata.com/FB7uoac_Uyc0euDFzH8oP8WJCaI@1000x562.jpg" alt="" /><br /><img class="cond" src="http://ekladata.com/gPyOsCqWjvh1FgkZGZwJ9mOtC54@1000x562.jpg" alt="" /><img class="cond" src="http://ekladata.com/lDAHbO1tvBVHrhorR1vsB4T9k_0@1000x562.jpg" alt="" /><img class="cond" src="http://ekladata.com/0FtKwbCjA74XPK8-pI57VT5ebis@1000x562.jpg" alt="" /><img class="cond" src="http://ekladata.com/oDOx65s0s6Ri7xJjpDvRRD6pYAg@1000x562.jpg" alt="" /></p>
    </div>
    <style><!--
    #diapo{position:absolute; z-index:1; width:4010px; height:1134px; display:inline; -webkit-animation: vendredi 30s linear .5s infinite normal; -webkit-animation-play-state:running;}
    @-webkit-keyframes vendredi{
    0%   {transform:translate(0px,0px);}
    10%   {transform:translate(0px,0px);}
    12%  {transform:translate(-1000px,-562px);}
    22%  {transform:translate(-1000px,-562px);}
    24%  {transform:translate(-2000px,0px);}
    34%  {transform:translate(-2000px,0px);}
    36%  {transform:translate(-3000px,-562px);}
    46%  {transform:translate(-3000px,-562px);}
    48%  {transform:translate(-3000px,0px);}
    58%  {transform:translate(-3000px,0px);}
    60%  {transform:translate(-2000px,-562px);}
    70%  {transform:translate(-2000px,-562px);}
    72%  {transform:translate(-1000px,0px);}
    82%  {transform:translate(-1000px,0px);}
    84%  {transform:translate(0px,-562px);}
    94%  {transform:translate(0px,-562px);}
    96% {transform:translate(0px,0px);}
    100% {transform:translate(0px,0px);}}
    #diapo:hover{-webkit-animation-play-state:paused;}
    --></style>