<?xml version="1.0" encoding="utf-8"?>
<!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" dir="ltr" lang="de-DE">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<title>slideshow - Javascript Web2.0 Bildergalerie</title>
<link rel="stylesheet" type="text/css" href="slideshow.css" media="screen" />
<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript" src="backgroundslider.js"></script>
<script type="text/javascript" src="slideshow.js"></script>
</head>
<body>
<h2>slideshow - Javascript Web2.0 Bildergalerie</h2>
<div id="slideshow">
<div id="footerlink-left">
<div id="example">
<div id="slideshowContainer" class="slideshowContainer"></div>
<div id="thumbnails">
<a href="1.jpg" class="slideshowThumbnail">
<a href="2.jpg" class="slideshowThumbnail">
<a href="3.jpg" class="slideshowThumbnail">
<a href="4.jpg" class="slideshowThumbnail">
<a href="5.jpg" class="slideshowThumbnail">
<a href="6.jpg" class="slideshowThumbnail">
<a href="7.jpg" class="slideshowThumbnail">
<a href="8.jpg" class="slideshowThumbnail">
<a href="9.jpg" class="slideshowThumbnail">
<a href="10.jpg" class="slideshowThumbnail">
<a href="11.jpg" class="slideshowThumbnail">
<a href="12.jpg" class="slideshowThumbnail">
<a href="13.jpg" class="slideshowThumbnail">
<a href="14.jpg" class="slideshowThumbnail">
<a href="15.jpg" class="slideshowThumbnail">
<a href="16.jpg" class="slideshowThumbnail">
<a href="17.jpg" class="slideshowThumbnail">
<a href="18.jpg" class="slideshowThumbnail">
<a href="19.jpg" class="slideshowThumbnail">
<a href="20.jpg" class="slideshowThumbnail">
<p><a href="#" onclick="show.play(); return false;">Abspielen</a> | <a href="#" onclick="show.stop(); return false;">Anhalten</a> | <a href="#" onclick="show.next(); return false;">Nächstes</a> | <a href="#" onclick="show.previous(); return false;">Vorhergehendes</a></p>
</div>
<script type="text/javascript">
// Javascript by Patrick Fischer
function useme_start() {
uwait = Number(document.getElementById("scontrol").getElementsByTagName("input")[0].value);
udura = Number(document.getElementById("scontrol").getElementsByTagName("input")[1].value);
ueffe = document.getElementById("scontrol").getElementsByTagName("select")[0].selectedIndex;
ueffe = document.getElementById("scontrol").getElementsByTagName("select")[0].getElementsByTagName("option")[ueffe].value;
uloop = document.getElementById("scontrol").getElementsByTagName("input")[2].checked ? true : false;
uthum = document.getElementById("scontrol").getElementsByTagName("input")[3].checked ? true : false;
//ubgsl = document.getElementById("scontrol").getElementsByTagName("input")[4].checked ? true : false;
var obj = {
wait: uwait,
effect: ueffe,
duration: udura,
loop: uloop,
thumbnails: uthum,
//backgroundslider: ubgsl,
backgroundslider: true,
onClick: function(i){alert(i)}
}
if (show) {
show.stop();
show.resetAnimation();
show.setOptions(show.getOptions(), obj);
show.play();
}
}
window.addEvent('domready',function(){
var obj = {
wait: 3000,
effect: 'fade',
duration: 1000,
loop: true,
thumbnails: true,
backgroundslider: false,
onClick: function(i){alert(i)}
}
show = new slideshow('slideshowContainer','slideshowThumbnail',obj);
show.play();
});
</script>
</div>
</div>
<div id="scontrol">
<p class="slidestts"><b>Einstellungen:</b></p>
<form action="">
<table>
<tr><td>Haltezeit (in ms):</td><td><input type="text" style="width: 40px;" maxlength="6" value="3000" /></td></tr>
<tr><td>Umschaltzeit (in ms):</td><td><input type="text" style="width: 40px;" maxlength="6" value="1000" /></td></tr>
<tr><td>Effekt:</td><td><select style="width: 100px;" size="1"><option value="fade">überblenden</option><option value="wipe">verschieben</option><option value="slide">überdecken</option><option value="random">zufällig</option></select></td></tr>
<tr><td>Wiederholung ein:</td><td><input type="checkbox" checked="checked" /></td></tr>
<tr><td>Vorschaubilder ein:</td><td><input type="checkbox" checked="checked" /></td></tr>
<!--<tr><td>backgroundslider ein:</td><td><input type="checkbox" checked="checked" /></td></tr>-->
<tr><td colspan="2"> </td></tr>
<tr><td colspan="2"><input type="button" value="Anwenden" onclick="useme_start();" /></td></tr>
</table>
</form>
</div>
</div>
</div>
</body>
</html>
