<html>
<head>
<title>Foto's</title>
<script language="javascript">
<!--
// geef alle foto's dezelfde naam, met uitzondering van het laatste karakter : foto0.jpg foto1.jpg.....
// Doe hetzelfde met je thumbnails
var curr_pic = 0;
var pics = 26;
// verander die 26 in het aantal foto's die je hebt
function changeImg(num) {
stopShow();
document.getElementById("the_picture").src = "jouwmap/jouwfoto" + num + ".gif";
// verander die "gif" in de juiste extentie
// "jouwmap" verander je in de naam van de map waar jij je foto's online in zet
// zet je die niet in een map, laat dan "jouwmap/" weg
// "jouwfoto" verander je in de naam die jij je foto's geeft, zonder het nummer erachter "foto"
curr_pic = num;
};
function nextImg() {
if (curr_pic == (pics-1)) {
curr_pic = 0;
} else {
curr_pic += 1;
};
document.getElementById("the_picture").src = "jouwmap/jouwfoto" + curr_pic + ".gif";
// verander ook hier die "gif"
// doe ook hier hetzelfde als voorheen met "jouwmap" en "jouwfoto"
};
function prevImg() {
if (curr_pic == 0) {
curr_pic = pics-1;
} else {
curr_pic -= 1;
};
document.getElementById("the_picture").src = "jouwmap/jouwfoto" + curr_pic + ".gif";
// hier nogmaals hetzefde met "gif", "jouwmap" en "jouwfoto"
};
var the_show = "";
function startShow() {
the_show = setInterval("nextImg();",1000);
// verander hier de "1000" in het aantal seconden dat je tussen de foto's wilt, MAAL DUIZEND
// vb : 2 seconden wordt 2000
};
function stopShow() {
if (the_show != "") {
clearInterval(the_show);
the_show = "";
};
};
-->
</script>
</head>
<body>
<table width="100%" height="90%">
<tr valign="middle"><td align="center" width="25%">
<script language="javascript">
<!--
for (var i = 0; i < pics; i++) {
document.write("<img src='jouwmap/jouwthumbnail" + i + ".gif' onClick='return changeImg(" + i + ");' vspace='1' hspace='1'>");
// ook hier verander je "jouwmap", "jouwthumbnail" en "gif" in het juiste
if (i % 4 == 3) document.write("<br>");
// dit geeft 4 thumbnails op een rij, wil je het anders, vb 5, dan verhoog je de 4 en de 3 met 1
};
-->
</script>
</td><td align="center">
<p><img src="jouwmap/jouwfoto0.gif" id="the_picture" height="38px"></p>
<!-- hierboven verander je ook "jouwmap", "jouwfoto" en "gif" in het juiste -->
<p><a href="javascript:prevImg(); stopShow();">Vorige</a>
<a href="javascript:startShow();">Start</a>
<a href="javascript:stopShow();">Stop</a>
<a href="javascript:nextImg(); stopShow();">Volgende</a></p>
</td></tr>
<tr><td align="center" colspan="2"><a href="http://www.jemimaja.be/" target="blank">Home</a></td></tr>
</table>
</body>
</html>