• Montage 2 nic

    Même montage mais au clic avec affichage en plein écran.

    Clic


    <div style="width: 56vw; height: 31.5vw; margin: 0vh auto; border: 0.5vh ridge grey; background: linear-gradient(to bottom, #6699cc 0%, #99ffff 100%); text-align: left;">
    <p id="nic0">Clic</p>
    <input id="ame1" class="ame" type="image" src="http://ekladata.com/mNds7wxhUpbP0igFYnVihPwiEEM@175x97.jpg">
    <input id="ame2" class="ame" type="image" src="http://ekladata.com/R7kcm57XCbEBPMwHLZ-diBk5BvE@175x97.jpg">
    <input id="ame3" class="ame" type="image" src="http://ekladata.com/I-bOOfZMw6-hsZO2oiJhdDJu_pk@175x97.jpg">
    <input id="ame4" class="ame" type="image" src="http://ekladata.com/MtqvrYdsboAabAjuVIfl_QhoRIE@175x97.jpg">
    <input id="ame5" class="ame" type="image" src="http://ekladata.com/CMHrwwhBHwq0wuylPC8JbIrAINw@175x97.jpg">
    <input id="ame6" class="ame" type="image" src="http://ekladata.com/1nz03-ON29I0f8yCok5j8tdlzRk@175x97.jpg">
    <img id="ric1" class="ric" src="http://ekladata.com/mNds7wxhUpbP0igFYnVihPwiEEM.jpg">
    <img id="ric2" class="ric" src="http://ekladata.com/R7kcm57XCbEBPMwHLZ-diBk5BvE.jpg">
    <img id="ric3" class="ric" src="http://ekladata.com/I-bOOfZMw6-hsZO2oiJhdDJu_pk.jpg">
    <img id="ric4" class="ric" src="http://ekladata.com/MtqvrYdsboAabAjuVIfl_QhoRIE.jpg">
    <img id="ric5" class="ric" src="http://ekladata.com/CMHrwwhBHwq0wuylPC8JbIrAINw.jpg">
    <img id="ric6" class="ric" src="http://ekladata.com/1nz03-ON29I0f8yCok5j8tdlzRk.jpg">
    </div>

    <style><!--
    #nic0{position:absolute; z-index:1; width:10vw; height:3vw; transform:translate(23vw,0.5vw); text-align:center; line-height:3vw; color:red; text-shadow:0.1vh 0.1vh black; font-size:2vw; }
    .ame{position:absolute; z-index:1; width:16vw; height:9vw; border:0.4vh solid white; box-shadow:0.4vh 0.4vh 0.6vh black;}
    #ame1{transform:translate(2vw,5vw);}
    #ame2{transform:translate(20vw,5vw);}
    #ame3{transform:translate(38vw,5vw);}
    #ame4{transform:translate(2vw,19vw);}
    #ame5{transform:translate(20vw,19vw);}
    #ame6{transform:translate(38vw,19vw);}
    .ric{position:absolute; z-index:100; width:100vw; height:0vw; left:0; top:0; transition:all 1.5s linear;}
    #ame1:focus ~ #ric1,#ame2:focus ~ #ric2,#ame3:focus ~ #ric3,#ame4:focus ~ #ric4,#ame5:focus ~ #ric5,#ame6:focus ~ #ric6{height:56.25vw;}
    --></style>