Diaporama 21 horizontal

Code:

<div id="mont">
<div id="ancres"><a id="lien1" class="ancre"></a><a id="lien2" class="ancre"></a><a id="lien3" class="ancre"></a> <a id="lien4" class="ancre"></a> <a id="lien5" class="ancre"></a> <a id="lien6" class="ancre"></a> <a id="lien7" class="ancre"></a> <a id="lien8" class="ancre"></a> <a id="lien9" class="ancre"></a> <a id="lien10" class="ancre"></a>
<p id="trx"><a href="#lien"><span style="color: red;">X</span></a></p>
<p id="comm">Pour celles et ceux qui pr&eacute;f&egrave;rent une pr&eacute;sentation plus "horizontale", voici le m&ecirc;me diaporama, avec d&eacute;fil&eacute; des vignettes et affichage au clic.</p>
<p id="tr0"><a href="#lien1"><img id="c1" src="http://ekladata.com/LanHsKiItU7ru4r_vXdYauNkCBM/DSCN6071.jpg" alt="" /></a><a href="#lien2"><img id="c1" src="http://ekladata.com/8S4ME0kv4O3uDF_aZmg0ZpJKSPY/DSCN6072.jpg" alt="" /></a><a href="#lien3"><img id="c1" src="http://ekladata.com/0YoVEL9ZlgSmKqF2hMGpolOtKUc/DSCN6073.jpg" alt="" /></a><a href="#lien4"><img id="c1" src="http://ekladata.com/v5id73tFhOdHKjmQYDJe8xGcMco/DSCN6074.jpgg" alt="" /></a><a href="#lien5"><img id="c1" src="http://ekladata.com/ShOHEunJODPzr3t3XxySaDhqonM/DSCN6075.jpg" alt="" /></a><a href="#lien6"><img id="c1" src="http://ekladata.com/awxbLKtDG8uvfcyl1aAZW2s36j8/DSCN6076.jpg" alt="" /></a><a href="#lien7"><img id="c1" src="http://ekladata.com/lQK6isECjY0I0jAZjSdLmJ2x2pc/DSCN6077.jpg" alt="" /></a><a href="#lien8"><img id="c1" src="http://ekladata.com/nCuouA8Gr7FVkw9bA6a4mlg_D5M/DSCN6078.jpg" alt="" /></a><a href="#lien9"><img id="c1" src="http://ekladata.com/7i4AkeIv3Gm7U4sfwmJZtBkzDlI/DSCN6080.jpg" alt="" /></a><a href="#lien10"><img id="c1" src="http://ekladata.com/lnYp3FpGG_oqIpAecw8o19_6YHU/DSCN6081.jpg" alt="" /></a></p>
<p id="img1">&nbsp;</p>
<p id="img2">&nbsp;</p>
<p id="img3">&nbsp;</p>
<p id="img4">&nbsp;</p>
<p id="img5">&nbsp;</p>
<p id="img6">&nbsp;</p>
<p id="img7">&nbsp;</p>
<p id="img8">&nbsp;</p>
<p id="img9">&nbsp;</p>
<p id="img10">&nbsp;</p>
</div>
</div>

<style type="text/css"><!--
#mont{position:relative; width:800px; height:600px; border:1px solid black; margin:10px auto; background:url('http://ekladata.com/UM7-cAwxvQ0lLzFhh1CPReOXYQY/silver4.jpg'); background-size:cover;}
#ancres a.ancre{display: none;}
#comm{text-align:center; font-size:14pt; position:absolute; transform:translate(100px,100px); width:600px;}
#trx{transform:translate(780px,10px);position:absolute;z-index:15; font-size: 25px; font-weight: bold;}
#tr0{transform:translate(300px,510px);position:absolute;z-index:15; width:150px; height:80px; overflow:auto; white-space:nowrap;}
#c1{width:80px; height:60px; border:2px solid white;}
#img1{position:absolute; z-index:1;transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/LanHsKiItU7ru4r_vXdYauNkCBM/DSCN6071.jpg'); background-size:cover;}
#img2{position:absolute; z-index:1; transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/8S4ME0kv4O3uDF_aZmg0ZpJKSPY/DSCN6072.jpg'); background-size:cover;}
#img3{position:absolute; z-index:1; transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/0YoVEL9ZlgSmKqF2hMGpolOtKUc/DSCN6073.jpg'); background-size:cover;}
#img4{position:absolute; z-index:1; transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/v5id73tFhOdHKjmQYDJe8xGcMco/DSCN6074.jpg'); background-size:cover;}
#img5{position:absolute; z-index:1; transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/ShOHEunJODPzr3t3XxySaDhqonM/DSCN6075.jpg'); background-size:cover;}
#img6{position:absolute; z-index:1; transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/awxbLKtDG8uvfcyl1aAZW2s36j8/DSCN6076.jpg'); background-size:cover;}
#img7{position:absolute; z-index:1; transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/lQK6isECjY0I0jAZjSdLmJ2x2pc/DSCN6077.jpg'); background-size:cover;}
#img8{position:absolute; z-index:1; transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/nCuouA8Gr7FVkw9bA6a4mlg_D5M/DSCN6078.jpg'); background-size:cover;}
#img9{position:absolute; z-index:1; transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/7i4AkeIv3Gm7U4sfwmJZtBkzDlI/DSCN6080.jpg'); background-size:cover;}
#img10{position:absolute; z-index:1; transform:translate(0px,590px); transition:all 1s linear; width:800px; height:0px; background:url('http://ekladata.com/lnYp3FpGG_oqIpAecw8o19_6YHU/DSCN6081.jpg'); background-size:cover;}

#ancres a#lien1:target ~ #img1{z-index:5; height:600px; transform:translate(0px,0px);}
#ancres a#lien2:target ~ #img2{z-index:5; height:600px; transform:translate(0px,0px);}
#ancres a#lien3:target ~ #img3{z-index:5; height:600px; transform:translate(0px,0px);}
#ancres a#lien4:target ~ #img4{z-index:5; height:600px; transform:translate(0px,0px);}
#ancres a#lien5:target ~ #img5{z-index:5; height:600px; transform:translate(0px,0px);}
#ancres a#lien6:target ~ #img6{z-index:5; height:600px; transform:translate(0px,0px);}
#ancres a#lien7:target ~ #img7{z-index:5; height:600px; transform:translate(0px,0px);}
#ancres a#lien8:target ~ #img8{z-index:5; height:600px; transform:translate(0px,0px);}
#ancres a#lien9:target ~ #img9{z-index:5; height:600px; transform:translate(0px,0px);}
#ancres a#lien10:target ~ #img10{z-index:5; height:600px; transform:translate(0px,0px);}
--></style>

...