• Défilé 3

    Pour vérifier ce que je propose... !

    Arrêt au survol.


    <div id="fd3">
    <div id="def3"><img style="float: left;" src="http://ekladata.com/mjFJjcm__lNgTpswgUsW-JZrv6I/6309.jpg" alt="" /> <img style="float: left;" src="http://ekladata.com/lE6xMwZ-WNKVBVT969F8mWXRHLs/6330.jpg" alt="" /> <img style="float: left;" src="http://ekladata.com/qVyMdXM9QPbA42WJeu5cwdf0YLw/6331.jpg" alt="" /> <img style="float: left;" src="http://ekladata.com/vTaDoTZpvysCHv7eoiVwelkPbSY/6332.jpg" alt="" /> <img style="float: left;" src="http://ekladata.com/_jeZlWKn_rMz9CKGmZy25kbbfUs/6439.jpg" alt="" /> <img style="float: left;" src="http://ekladata.com/mjFJjcm__lNgTpswgUsW-JZrv6I/6309.jpg" alt="" /></div>
    </div>

    <style type="text/css"><!--
    #fd3{width:800px; height:600px; margin:5px auto; border:4px solid white; overflow:hidden;}
    #def3{animation:ex1 20s linear infinite; width:4800px; height:600px; animation-play-state:running;}
    #def3:hover{animation-play-state:paused;}

    @keyframes ex1{
    0% { transform:translate(0px,0px);}
    13% {transform:translate(0px,0px);}
    16% {transform:translate(-800px,0px);}
    33% {transform:translate(-800px,0px);}
    36% {transform:translate(-1600px,0px);}
    53% {transform:translate(-1600px,0px);}
    56% {transform:translate(-2400px,0px);}
    73% {transform:translate(-2400px,0px);}
    76% {transform:translate(-3200px,0px);}
    93% {transform:translate(-3200px,0px);}
    96% {transform:translate(-4000px,0px);}
    100% {transform:translate(-4000px,0px);} }
    --></style>