Flip plus simple

2 images animées en 800x450px, créées à partir de courtes vidéos (2 secondes), converties au format Gif, hébergées sur Ekla (album).
Survolez l'image.

<div id="fl">
<p id="fl1">&nbsp;</p>
<p id="fl2">&nbsp;</p>
<p id="fl3">&nbsp;</p>
</div>

<style><!--
#fl{width:800px; height:450px; margin:5px auto;}
#fl1{position:absolute; z-index:10; width:800px; height:450px;}
#fl2{position:absolute; z-index:1; width:800px; height:450px; background:url(https://ekladata.com/AxC3pAl6PGxIU_lHYKSxN3cOBIo.gif); transform:translate(0px,0px) rotatey(180deg); transition:all 1s linear;}
#fl3{position:absolute; z-index:2; width:800px; height:450px; background:url(https://ekladata.com/BLJ1Ud2imX67WaSVyzeH3Uvzpfg.gif); transform:translate(0px,0px) rotatey(0deg); transition:all 1s linear;}
#fl1:hover ~ #fl2{z-index:5;transform:translate(0px,0px) rotatey(0deg);}
#fl1:hover ~ #fl3{z-index:3;transform:translate(0px,0px) rotatey(180deg);}
--></style>