• Montage pour Nicole

    Montage pour 4 images en 800x600px.

    Clic sur chaque bouton pour afficher l'image correspondante.

    Cette zone texte vous permet de présenter le sujet.

    <div id="m1"><input id="m2" class="m0" type="text" /> <input id="m3" class="m0" type="text" /> <input id="m4" class="m0" type="text" /> <input id="m5" class="m0" type="text" /> <span id="m7"><span style="color: red; text-shadow: 1px 1px black; font-size: 18pt;">Clic sur chaque bouton</span> pour afficher l'image correspondante.<br /><br />Cette zone texte vous permet de pr&eacute;senter le sujet.</span></div>

    <style><!--
    #m1{width:806px; height:660px; border:4px solid grey; box-shadow:4px 4px 8px black; margin:10px auto; background:url('http://ekladata.com/Mv2Ui-0IMKI2YL5-R_py8puDWc8/yellow20.jpg');}
    .m0{position:absolute; z-index:1; width:200px; height:50px; border:2px solid white; box-sizing:border:box; transition:all 2s linear;}
    #m2{background:url('http://ekladata.com/Aeo6W6-8i9WbX6nq91eWjQ7oFsc.jpg'); transform:translate(0px,0px) rotate(-180deg);}
    #m3{background:url('http://ekladata.com/8g71pKznvk3MxZeoDcmj_cTSGNk.jpg'); transform:translate(200px,0px) rotate(-180deg);}
    #m4{background:url('http://ekladata.com/gUQoTrQM3qp-2sHBJkr4NIlOBcc.jpg'); transform:translate(400px,0px) rotate(-180deg);}
    #m5{background:url('http://ekladata.com/AGaZ6uGeKueA2wwAdoJIvQZgMV8.jpg'); transform:translate(600px,0px) rotate(-180deg);}
    #m7{position:absolute; z-index:1; width:800px; height:400px; transform:translate(0px,150px); text-align:center; font-size:16pt;}
    #m2:focus, #m3:focus,#m4:focus,#m5:focus{z-index:5; transform:translate(0px,55px) rotate(0deg); width:800px; height:600px;}
    --></style>