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>
<p id="av0"><a href="#lien"><span style="color: yellow;">clic</span></a></p>
<p id="av1"><a href="#lien1"><img style="width: 80px; height: 60px;" src="http://ekladata.com/omkHvdI_dFfTblNPmCdbri94EL8/1px-par-1px.png" alt="" /></a></p>
<p id="av2"><a href="#lien2"><img style="width: 80px; height: 60px;" src="http://ekladata.com/omkHvdI_dFfTblNPmCdbri94EL8/1px-par-1px.png" alt="" /></a></p>
<p id="av3"><a href="#lien3"><img style="width: 80px; height: 60px;" src="http://ekladata.com/omkHvdI_dFfTblNPmCdbri94EL8/1px-par-1px.png" alt="" /></a></p>
<p id="av4"><a href="#lien4"><img style="width: 80px; height: 60px;" src="http://ekladata.com/omkHvdI_dFfTblNPmCdbri94EL8/1px-par-1px.png" alt="" /></a></p>
<p id="av5"><a href="#lien5"><img style="width: 80px; height: 60px;" src="http://ekladata.com/omkHvdI_dFfTblNPmCdbri94EL8/1px-par-1px.png" alt="" /></a></p>
<p id="dia0"> </p>
<p id="dia1"> </p>
<p id="dia2"> </p>
<p id="dia3"> </p>
<p id="dia4"> </p>
<p id="dia5"> </p>
</div>
</div>
<style><!--
#mont{position:relative; width:800px; height:600px; border:4px double white; border:4px double white; margin:10px auto; overflow:hidden; }
#ancres a.ancre{display: none;}
#av0{position:absolute; z-index:5; width:60px; height:40px; font-size:20pt; text-shadow:1px 1px black; transform:translate(740px,0px); border:1px solid yellow; text-align:center; background-color:rgba(128,128,128,0.5);}
#av1{position:absolute; z-index:2; transform:translate(100px,0px);}
#av2{position:absolute; z-index:2; transform:translate(200px,0px);}
#av3{position:absolute; z-index:2; transform:translate(300px,0px);}
#av4{position:absolute; z-index:2; transform:translate(400px,0px);}
#av5{position:absolute; z-index:2; transform:translate(500px,0px);}
#dia0{position:absolute; z-index:1; width:800px; height:600px; transform:translate(0px,0px); background:url('http://ekladata.com/pourquoipas732.eklablog.com/perso/2015/septembre/04/DSCN2734.JPG');}
#dia1{position:absolute; z-index:1; transition:height 2s linear 0s, width 2s linear 2s, transform 2s linear 2s; width:80px; height:60px; transform:translate(100px,0px); border:2px solid lime; background:url('http://ekladata.com/pourquoipas732.eklablog.com/perso/2015/septembre/04/DSCN2786.JPG'); background-position:15% 0%;}
#dia2{position:absolute; z-index:1; transition:height 2s linear 0s, width 2s linear 2s, transform 2s linear 2s; width:80px; height:60px; transform:translate(200px,0px); border:2px solid lime; background:url('http://ekladata.com/pourquoipas732.eklablog.com/perso/2015/septembre/04/DSCN2787.JPG'); background-position:30% 0%;}
#dia3{position:absolute; z-index:1; transition:height 2s linear 0s, width 2s linear 2s, transform 2s linear 2s; width:80px; height:60px; transform:translate(300px,0px); border:2px solid lime; background:url('http://ekladata.com/pourquoipas732.eklablog.com/perso/2015/septembre/04/DSCN2851f.JPG'); background-position:45% 0%;}
#dia4{position:absolute; z-index:1; transition:height 2s linear 0s, width 2s linear 2s, transform 2s linear 2s; width:80px; height:60px; transform:translate(400px,0px); border:2px solid lime; background:url('http://ekladata.com/pourquoipas732.eklablog.com/perso/2015/septembre/04/DSCN2871.JPG'); background-position:60% 0%;}
#dia5{position:absolute; z-index:1; transition:height 2s linear 0s, width 2s linear 2s, transform 2s linear 2s; width:80px; height:60px; transform:translate(500px,0px); border:2px solid lime; background:url('http://ekladata.com/pourquoipas732.eklablog.com/perso/2015/septembre/04/DSCN2894.JPG'); background-position:75% 0%;}
#ancres a#lien1:target ~ #dia1{transform:translate(0px,0px); width:800px; height:600px; border:0px; z-index:3;}}
#ancres a#lien2:target ~ #dia2{transform:translate(0px,0px); width:800px; height:600px; border:0px; z-index:3;}}
#ancres a#lien3:target ~ #dia3{transform:translate(0px,0px); width:800px; height:600px; border:0px; z-index:3;}}
#ancres a#lien4:target ~ #dia4{transform:translate(0px,0px); width:800px; height:600px; border:0px; z-index:3;}}
#ancres a#lien5:target ~ #dia5{transform:translate(0px,0px); width:800px; height:600px; border:0px; z-index:3;}}
--></style>
...
...