Hey,
ich habe ein problem mit einer Slideshow. Die Slideshow hat ein großes Bild und unten drunter sind 4 Thumbnails ... klickt man auf ein Thumbnail ändert sich das große Bild.
Nun möchte ich auch bei einem klick auf ein Thumbnail einen anderen Text anzeigen ... also Bild 1 = Text 1 , Bild 2 = Text 2 usw.
Hier mal der Javascript Code
Code:
<script type="text/javascript">
jQuery.PictureSlides.set({
// Switches to decide what features to use
useFadingIn : true,
useFadingOut : true,
useFadeWhenNotSlideshow : true,
useFadeForSlideshow : true,
useDimBackgroundForSlideshow : true,
loopSlideshow : false,
usePreloading : true,
useAltAsTooltip : true,
useTextAsTooltip : true,
// Fading settings
fadeTime : 500, // Milliseconds
timeForSlideInSlideshow : 2000, // Milliseconds
// At page load
startIndex : 1,
startSlideShowFromBeginning : true,
startSlideshowAtLoad : false,
dimBackgroundAtLoad : false,
// Large images to use and thumbnail settings
images : [
{
image : "fileadmin/templates/index_01_FILES/slide/pictures/1.jpg",
alt : "Picture 1",
text : "Text 1"
},
{
image : "fileadmin/templates/index_01_FILES/slide/pictures/3.jpg",
alt : "Picture 3",
text : "Text 2",
url : ""
},
{
image : "fileadmin/templates/index_01_FILES/slide/pictures/4.jpg",
alt : "Picture 4",
text : "Text 3",
url : ""
},
{
image : "fileadmin/templates/index_01_FILES/slide/pictures/5.jpg",
alt : "Picture 5",
text : "Text 4"
},
],
thumbnailActivationEvent : "click",
// Classes of HTML elements to use
mainImageClass : "picture-slides-image", // Mandatory
mainImageFailedToLoadClass : "picture-slides-image-load-fail",
imageLinkClass : "picture-slides-image-link",
fadeContainerClass : "picture-slides-fade-container",
imageTextContainerClass : "picture-slides-image-text",
previousLinkClass : "picture-slides-previous-image",
nextLinkClass : "picture-slides-next-image",
imageCounterClass : "picture-slides-image-counter",
startSlideShowClass : "picture-slides-start-slideshow",
stopSlideShowClass : "picture-slides-stop-slideshow",
thumbnailContainerClass: "picture-slides-thumbnails",
dimBackgroundOverlayClass : "picture-slides-dim-overlay"
});
</script>
Ich habe oben mal als Beispiel in text Text 1 usw eingefügt. Das funktioniert auch Perfekt nur leider soll der Text der dort rein muss auch mit HTML ELementen sein also zum Beispiel ein h3 oder ein div ... er schreibt das aber mit aus also er gibt das html mit als Text aus.
Nun habe ich es mit document.write Probiert:
Code:
images : [
{
image : "fileadmin/templates/index_01_FILES/slide/pictures/1.jpg",
alt : "Picture 1",
text : document.write('<h3>Text 1</h3>')
},
{
image : "fileadmin/templates/index_01_FILES/slide/pictures/3.jpg",
alt : "Picture 3",
text : "",
url : ""
},
{
image : "fileadmin/templates/index_01_FILES/slide/pictures/4.jpg",
alt : "Picture 4",
text : document.write('<h3>Text 2</h3>'),
url : ""
},
......
Aber dann gibt er sofort alle beiden texte aus ohne das man auf das Thumbnail geklickt hat.
Was mache ich Falsch
Ich Danke euch im vorraus für eure Hilfe.