• Mont.1.4.23

     8 images au ratio 16/9 en 1000x563px.

    SURVOL

     <div style="width: 1000px; height: 563px; margin: 30px auto; text-align: left;">
    <p id="tul0">SURVOL</p>
    <img id="tul1" class="tul" src="http://ekladata.com/pItLPh9vs0Z24U27TwtdOLMNqIg.jpg" alt="" /> <img id="tul2" class="tul" src="http://ekladata.com/S70v0HTfip2fOJDelXITmQaTvsQ.jpg" alt="" /> <img id="tul3" class="tul" src="http://ekladata.com/TENqwXaWLQR0obG_DXxr8Xc0rwQ.jpg" alt="" /> <img id="tul4" class="tul" src="http://ekladata.com/c43hiiLT2q9PtytdO21k0KDbwSM.jpg" alt="" /> <img id="tul5" class="tul" src="http://ekladata.com/qQhEw-FlMfLbURLCfOUOcy6k-Yw.jpg" alt="" /> <img id="tul6" class="tul" src="http://ekladata.com/CSEROY5AQXNe6HRZcUIIy1LvFP4.jpg" alt="" /> <img id="tul7" class="tul" src="http://ekladata.com/mt86vm25SUZx8oLqtBI26Pb0hgY.jpg" alt="" /> <img id="tul8" class="tul" src="http://ekladata.com/ImWdPsDEWeUxzNGYCTCrM3CwTUg.jpg" alt="" /></div>

    <style><!--
    #tul0{position:absolute; z-index:1; width:1000px; text-align:center; font-size:30px; transform:translate(0px,250px);}
    .tul{position:absolute; z-index:1; width:480px; height:270px; border:4px solid white; transition:all 1s;}
    #tul1{box-sizing:border-box; transform: translate(10px,-100px) perspective(500px) rotatex(60deg); transform-origin:bottom center;}
    #tul2{box-sizing:border-box; transform: translate(510px,-100px) perspective(500px) rotatex(60deg); transform-origin:bottom center;}
    #tul3{box-sizing:border-box; transform: translate(10px,170px) perspective(500px) rotatex(-60deg); transform-origin:top center;}
    #tul4{box-sizing:border-box; transform: translate(510px,170px) perspective(500px) rotatex(-60deg); transform-origin:top center;}
    #tul5{box-sizing:border-box; transform: translate(10px,140px) perspective(500px) rotatex(60deg); transform-origin:bottom center;}
    #tul6{box-sizing:border-box; transform: translate(510px,140px) perspective(500px) rotatex(60deg); transform-origin:bottom center;}
    #tul7{box-sizing:border-box; transform: translate(10px,410px) perspective(500px) rotatex(-60deg); transform-origin:top center;}
    #tul8{box-sizing:border-box; transform: translate(510px,410px) perspective(500px) rotatex(-60deg); transform-origin:top center;}
    #tul1:hover,#tul2:hover,#tul3:hover,#tul4:hover,#tul5:hover,#tul6:hover,#tul7:hover,#tul8:hover{z-index:5; width:1000px; height:563px; transform:translate(0px,0px) perspective(5000px) rotatex(0deg);}
    --></style>