Auf Thema antworten

Beitrag

[QUOTE="tatura, post: 8129, member: 1669"]
Hallo liebe Forum-Gemeinde,

ich habe einen Slider gefunden, der genau das macht, 
was ich mir vorgestellt habe:
[URL="http://www.menucool.com/slider/jquery-slider-lightbox"]http://www.menucool.com/slider/jquery-slider-lightbox[/URL]

Es war recht schwierig, einen Slider zu finden, in dem 
man die Bilder auch in einer Vergrösserung ansehen kann.

Für eine Referenzen Seite sollen aber auf einer Seite 
mehrere dieses Scriptes laufen: [URL="http://deineneuewebseite.com/referenzen-2014.html"]http://referenzen[/URL]

Ich habe mich schon in verschiedenen Foren "schlau" gemacht 
und weiss, dass ich eindeutige ID vergeben muss, damit die 
Scripte wissen, was sie ansteuern sollen.

Mein JS Wissen ist nur rudimentär, deshalb sind bisher alle 
Bemühungen gescheitert.

Wenn ich den unteren Slider zuerst anklicke funktioniert er 
und die Bilder gehen auf. Beim oberen geht gar nichts nichts.
Wenn ich aber zuerst den oberen anklicke, dann gehen beide nicht.
Hier nochmal der Link zu der Seite:
[URL="http://deineneuewebseite.com/referenzen-2014.html"]http://referenzen[/URL]

Vielleicht kennt ja hier jemand die Lösung. Das wäre toll!

Viele Grüße
Petra

So sieht der Code aus:

[CODE]
<script src="slider-referenzen/2014/thumbnail-slider1.js" type="text/javascript"></script>
<script src="slider-referenzen/2014/thumbnail-slider2.js" type="text/javascript"></script>
<script>
            var thumbSldr = document.getElementById("thumbnail-slider1");
            var closeBtnr = document.getElementById("closeBtn");
            var galleryImgsr = document.getElementById("myGallery1").getElementsByTagName("li");
            for (var i = 0; i < galleryImgsr.length; i++) {
                galleryImgsr[i].index = i;
                galleryImgsr[i].onclick = function (e) {
                    var li = this;
                    thumbSldr.style.display = "block";
                    mcThumbnailSlider.init(li.index);
                };
            }

thumbSldr.onclick = closeBtnr.onclick = function (e) {
                //This event will be triggered only when clicking the area outside the thumbs or clicking the CLOSE button
                thumbSldr.style.display = "none";
            };
</script>
<script>
            
            var thumbSldl = document.getElementById("thumbnail-slider2");
            var closeBtnl = document.getElementById("closeBtn");
            var galleryImgsl = document.getElementById("myGallery2").getElementsByTagName("li");
            for (var i = 0; i < galleryImgsl.length; i++) {
                galleryImgsl[i].index = i;
                galleryImgsl[i].onclick = function (e) {
                    var li = this;
                    thumbSldl.style.display = "block";
                    mcThumbnailSlider.init(li.index);
                };
            }

thumbSldl.onclick = closeBtnl.onclick = function (e) {
                //This event will be triggered only when clicking the area outside the thumbs or clicking the CLOSE button
                thumbSldl.style.display = "none";
            };
</script>
[/CODE]
[/QUOTE]

Authentifizierung