• Diapo 1

    Je conseille de réduire les barres hautes et la barre Ekla pour un affichage plein écran en centrant verticalement le montage.
    Mes photos sont dimensionnées et hébergées en 1920x1080px.

    Survol

    A

    B

    C

    D

    E

    F

    G

    H

    J

    K


    <div style="z-index: 100; width: 100vw; height: 56.25vw; transform: translate(0vw,0vw); background: url('http://ekladata.com/XHZ0mydV7H5gUc2gnqjJB8W1Uvo.jpg'); background-size: cover;">
    <p id="sv0" class="sv">Survol</p>
    <p id="sv1" class="sv">A</p>
    <p id="sv2" class="sv">B</p>
    <p id="sv3" class="sv">C</p>
    <p id="sv4" class="sv">D</p>
    <p id="sv5" class="sv">E</p>
    <p id="sv6" class="sv">F</p>
    <p id="sv7" class="sv">G</p>
    <p id="sv8" class="sv">H</p>
    <p id="sv9" class="sv">J</p>
    <p id="sv10" class="sv">K</p>
    <img id="gde1" class="gde" src="http://ekladata.com/WeuyYLa_Bw75cBgky9GSgVS6XUY.jpg" alt="" /> <img id="gde2" class="gde" src="http://ekladata.com/UOdgR34gmbK8DV7mCCLqLk8tt7I.jpg" alt="" /> <img id="gde3" class="gde" src="http://ekladata.com/xv-I7bGScUvnsChMIRhVKaMiNOc.jpg" alt="" /> <img id="gde4" class="gde" src="http://ekladata.com/CaO0vHSDKJQxBYR0wmd9kAhYI3E.jpg" alt="" /> <img id="gde5" class="gde" src="http://ekladata.com/aeEn0yi5iLIVoaktiZDD7clQYFc.jpg" alt="" /> <img id="gde6" class="gde" src="http://ekladata.com/ogIjDsp488YYNbDTEpltt8kFh5s.jpg" alt="" /> <img id="gde7" class="gde" src="http://ekladata.com/Nzy6FwcQ60_1MWx3us32oQYWQiU.jpg" alt="" /> <img id="gde8" class="gde" src="http://ekladata.com/JaTygw-NAXwW0sKNY5ZWJPWsRCo.jpg" alt="" /> <img id="gde9" class="gde" src="http://ekladata.com/Tpxqv1fBkSDT594A9joOvVWk7rA.jpg" alt="" /> <img id="gde10" class="gde" src="http://ekladata.com/dfYohfyZ7S_0MU5ttntUFxaLLGE.jpg" alt="" /></div>

    <style><!--
    .sv{position:absolute; z-index:110; font-size:2vw; color:white; text-shadow:0.1vh 0.1vh black;}
    #sv0{transform:translate(10vw,1vw);}
    #sv1{transform:translate(20vw,1vw);}
    #sv2{transform:translate(23vw,1vw);}
    #sv3{transform:translate(26vw,1vw);}
    #sv4{transform:translate(29vw,1vw);}
    #sv5{transform:translate(32vw,1vw);}
    #sv6{transform:translate(35vw,1vw);}
    #sv7{transform:translate(38vw,1vw);}
    #sv8{transform:translate(41vw,1vw);}
    #sv9{transform:translate(44vw,1vw);}
    #sv10{transform:translate(46vw,1vw);}
    .gde{position:absolute; z-index:105;width:100vw; height:56.25vw; left:0; top:0; opacity:0; transition:all 0.5s linear;}
    #sv1:hover ~ #gde1,#sv2:hover ~ #gde2,#sv3:hover ~ #gde3,#sv4:hover ~ #gde4,#sv5:hover ~ #gde5,#sv6:hover ~ #gde6,#sv7:hover ~ #gde7,#sv8:hover ~ #gde8,#sv9:hover ~ #gde9,#sv10:hover ~ #gde10{opacity:1;}
    --></style>