Montage 123

Sur le même principe: ici sans image de fond et la page suivante, avec, au choix !

Clic maintenu

<div style="width: 60vw; height: 33.75vw; margin: 1vh 0 0 20vw; text-align: left;"><img id="aut1" class="aut" src="http://ekladata.com/ECCNKLfwq5IPTkkphSyqKWt9-zc.jpg" alt="" /><img id="aut2" class="aut" src="http://ekladata.com/8xeYbbW-poRSTvwAqmEIOAQcRT8.jpg" alt="" /><img id="aut3" class="aut" src="http://ekladata.com/tHgfE09-dLd-vgL8Jpi6M7UGLRk.jpg" alt="" /><img id="aut4" class="aut" src="http://ekladata.com/o5jkavgHOpHI0huwrCz0ilsVNl4.jpg" alt="" /><img id="aut5" class="aut" src="http://ekladata.com/aOCURPvGtExt9ITmlYCi3BOgoNU.jpg" alt="" /><img id="aut6" class="aut" src="http://ekladata.com/HiyTd2d7_yoogB-34qp3XwLpU9Y.jpg" alt="" /><img id="aut7" class="aut" src="http://ekladata.com/SnQXa4_RuOUevsAQWL5vDEcn1Xw.jpg" alt="" /><img id="aut8" class="aut" src="http://ekladata.com/wh4_wtdfybAPf9Yrg2sZpMd4HR4.jpg" alt="" />
<p id="sv">Clic maintenu</p>
</div>
<style><!--
#sv{position:absolute; z-index:1; width:20vw; height:11.25vw; box-sizing:border-box; transform:translate(20vw,11.25vw); text-align:left; font-size:2vw; color:coral; line-height:2vw; text-shadow:0.2vh 0.2vh black;}
.aut{position:absolute; z-index:1; width:15vw; height:6vw; border-radius:3vw; border:0.3vh solid white; box-shadow:0.3vh 0.3vh 0.6vh black; background-size:cover; transition:all 1s linear;}
#aut1{box-sizing:border-box; transform:translate(2vw,0vw) rotatey(180deg);}
#aut2{box-sizing:border-box; transform:translate(20vw,0vw) rotatey(180deg);}
#aut3{box-sizing:border-box; transform:translate(40vw,0vw) rotatey(180deg);}
#aut4{box-sizing:border-box; transform:translate(2vw,11.25vw) rotatey(180deg);}
#aut5{box-sizing:border-box; transform:translate(40vw,11.25vw) rotatey(180deg);}
#aut6{box-sizing:border-box; transform:translate(2vw,22.5vw) rotatey(180deg);}
#aut7{box-sizing:border-box; transform:translate(20vw,22.5vw) rotatey(180deg);}
#aut8{box-sizing:border-box; transform:translate(40vw,22.25vw) rotatey(180deg);}
#aut1:active,#aut2:active,#aut3:active,#aut4:active,#aut5:active,#aut6:active,#aut7:active,#aut8:active{z-index:5; width:100vw; height:56.25vw; border-radius:0%; box-shadow:none; transform:translate(-21vw,0vw) rotatey(0deg);}
--></style>