Hallo
Ich hab eine Bildergalerie mit Thumbnails und einer Grossansicht. Als Navigation kann man entweder auf die Thumbnails klicken oder auf den Vor-und Zurück- Button.
Klickt man auf ein Thumbnail wird dieses markiert:
Für die Vor-und Zurück - Navigation nutze ich das:
Zur besseren Orientierung sollte das jeweilige Thumbnail, das in der Grossansicht erscheint nun auch da markiert sein.
Steh da grad auf dem Schlauch..![Frown :( :(](data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)
Jemand ein Tipp für mich?
Ich hab eine Bildergalerie mit Thumbnails und einer Grossansicht. Als Navigation kann man entweder auf die Thumbnails klicken oder auf den Vor-und Zurück- Button.
Klickt man auf ein Thumbnail wird dieses markiert:
Code:
<script type="text/javascript">
var ImageSelector = function() {
var imgs = null;
var selImg = null;
return {
addImages: function(container) {
imgs = container.getElementsByTagName("img");
for(var i = 0, len = imgs.length; i < len; i++) {
var img = imgs[i];
img.className = "thumbs";
img.onclick = function() {
if(selImg) {
selImg.className = "thumbs";
}
this.className = "thumbsSel";
selImg = this;
};
}
}
};
}();
</script>
<script type="text/javascript">
var div = document.getElementById("layerShowThumbs");
ImageSelector.addImages(div);
</script>
Für die Vor-und Zurück - Navigation nutze ich das:
PHP:
<script type="text/javascript">
/*JS für Bild Vor- und Zurück - Navigation*/
var bildIndex = 0;
bilder = new Array;
bildname = new Array;
<?php
$i = 0;
while($pics = mysql_fetch_object($resultJS))
{
?>
bilder[<?php echo $i;?>] = "news/upload/bilder/<?php echo $pics->bild;?>";
bildname[<?php echo $i;?>] = "<?php echo $pics->bildtitel;?>";
<?php
++$i;
}
?>
function vor()
{
bildIndex++;
if (bildIndex == bilder.length) bildIndex = 0;
document.getElementById("bild1").src = bilder[bildIndex];
Bildname=bildname[bildIndex];
document.getElementById('bild_titel').innerHTML=Bildname;
}
function zurueck()
{
bildIndex--;
if (bildIndex < 0) bildIndex = bilder.length-1;
document.getElementById("bild1").src = bilder[bildIndex];
Bildname=bildname[bildIndex];
document.getElementById('bild_titel').innerHTML=Bildname;
}
</script>
Steh da grad auf dem Schlauch..
Jemand ein Tipp für mich?