1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<script type="text/javascript" src="js/highslide-full.js"></script>
<link rel="stylesheet" type="text/css" href="js/highslide.css" />
<body>
<script type="text/javascript">
hs.graphicsDir = 'graphics/';
hs.align = 'center';
hs.transitions = ['expand', 'crossfade'];
hs.fadeInOut = true;
hs.dimmingOpacity = 0.8;
hs.outlineType = 'rounded-white';
hs.captionEval = 'this.thumb.alt';
hs.marginBottom = 105; // make room for the thumbstrip and the controls
hs.numberPosition = 'caption';
// Add the slideshow providing the controlbar and the thumbstrip
hs.addSlideshow({
//slideshowGroup: 'group1',
interval: 5000,
repeat: false,
useControls: true,
overlayOptions: {
className: 'text-controls',
position: 'bottom center',
relativeTo: 'viewport',
offsetY: -60
},
thumbstrip: {
position: 'bottom center',
mode: 'horizontal',
relativeTo: 'viewport'
}
});
</script>
<script language="JavaScript">
var hauteur_tab=100 //hauteur du tableau
var temp=600 //temp pour le defilement
var nbr_de_cellule=6 // nombre de cellules (images) visibles
var xx=nbr_de_cellule
var suivi=0
// tableau qui stock le nom des images
tbimage=new Array("Couv_TUNIQUES_38_p","5","Couv_TUNIQUES_38_p","5","Couv_TUNIQUES_38_p","5","5","Couv_TUNIQUES_38_p","5","5","5","5","5","Couv_TUNIQUES_38_p","5","Couv_TUNIQUES_38_p","5","Couv_TUNIQUES_38_p","5","Couv_TUNIQUES_38_p","5","Couv_TUNIQUES_38_p","5","Couv_TUNIQUES_38_p","5","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p","Couv_TUNIQUES_38_p")
// tableau qui stock les liens qui peut etre une url
tblien=new Array("d7","d7_02","d7_03","d7_04","d7_05","d7_06","d8","d8_02","d8_03","d8_04","d8_05","d8_06","d10","d10_02","d10_03","d10_04","d10_05","d10_06","d1","d1_02","d1_03","d1_04","d1_05","d1_06","d2","d2_02","d2_03","d2_04","d2_05","d2_06","d3","d4","d4_02","d4_03","d4_04","d4_05","d4_06","d5","d5_02","d5_03","d5_04","d5_05","d5_06","d6","d6_02","d6_03","d6_04","d6_05","d6_06")
function function1() {
if(xx>=tbimage.length-1){
xx=xx-tbimage.length
}
xx++
document.getElementById("ntab").rows[0].insertCell(nbr_de_cellule)
document.getElementById("ntab").rows[0].cells[nbr_de_cellule].appendChild(document.createElement('a')).href='images/'+tblien[xx]+'.png'.onclick='return hs.expand(this)'; //class='highslide' href='images/Montage-19.jpg' onclick="return hs.expand(this)"a modifier si on veut mettre un lien url exemple a mettre apres le egale: ( tblien[xx] )
document.getElementById("ntab").rows[0].cells[nbr_de_cellule].lastChild.appendChild(document.createElement('img'));
document.getElementById("ntab").rows[0].cells[nbr_de_cellule].lastChild.lastChild.style.height=hauteur_tab+"px"
document.getElementById("ntab").rows[0].cells[nbr_de_cellule].lastChild.lastChild.src='images/'+tbimage[xx]+'.png' //nom et endroit ou se trouve l'image
document.getElementById("ntab").rows[0].deleteCell(0)
}
function function2() {
if(xx<=0){
xx=tbimage.length+(xx)
}
xx--
document.getElementById("ntab").rows[0].insertCell(0)
document.getElementById("ntab").rows[0].cells[0].appendChild(document.createElement('a')).href='images/'+tblien[xx]+'.png'.onclick='return hs.expand(this)'; //a modifier si on veut mettre un lien url exemple a mettre apres le egale: ( tblien[xx] )
document.getElementById("ntab").rows[0].cells[0].lastChild.appendChild(document.createElement('img'));
document.getElementById("ntab").rows[0].cells[0].lastChild.lastChild.style.height=hauteur_tab+"px"
document.getElementById("ntab").rows[0].cells[0].lastChild.lastChild.src='images/'+tbimage[xx]+'.png' //nom et endroit ou se trouve l'image
document.getElementById("ntab").rows[0].deleteCell(nbr_de_cellule)
}
function aller() {
if(suivi==0){
suivi=1
bozo=setInterval('function1()',temp)
}
else{
clearInterval(bozo)
suivi=0
}
}
function retour() {
if(suivi==0){
xx=xx-(nbr_de_cellule-1)
suivi=1
bozo=setInterval('function2()',temp)
}
else{
clearInterval(bozo)
xx=xx+(nbr_de_cellule-1)
suivi=0
}
}
</script>
<div class="highslide-gallery" style="width: 1000px; margin: auto">
<div align='center'>
<img src='retour2.jpg' onmouseover='aller();this.src="retour.jpg"' onmouseout='aller();this.src="retour2.jpg"' />
<table id="ntab" border='no' rules='none'>
<tr id='fg'>
<!--attention si le tableau doit contenir six cellules mettre six liens -->
<td> <a class='highslide' href='images/Montage-19.jpg' onclick="return hs.expand(this)"> <img src='images/5.png' width="130" height=100 border="0"></a> </td>
<td> <a class='highslide' href='images/Montage-19.jpg' onclick="return hs.expand(this)"> <img src='images/5.png' width="130" height=100 border="0"> </a> </td>
<td> <a class='highslide' href='images/Montage-19.jpg' onclick="return hs.expand(this)"> <img src='images/5.png' width="130" height=100 border="0"> </a> </td>
<td> <a class='highslide' href='images/Montage-19.jpg' onclick="return hs.expand(this)"> <img src='images/5.png' width="130" height=100 border="0"> </a> </td>
<td> <a class='highslide' href='images/Montage-19.jpg' onclick="return hs.expand(this)"> <img src='images/5.png' width="130" height=100 border="0"> </a> </td>
<td> <a class='highslide' href='images/Montage-19.jpg' onclick="return hs.expand(this)"> <img src='images/5.png' width="130" height=100 border="0"> </a> </td>
</tr>
</table>
<div align='center'><img src='aller2.jpg' onmouseover='retour();this.src="aller.jpg"' onmouseout='retour();this.src="aller2.jpg"'></div>
</div>
</div>
</body>
</html> |
Partager