T
tatura
New member
- Beiträge
- 1
- Punkte Reaktionen
- 0
Hallo liebe Forum-Gemeinde,
ich habe einen Slider gefunden, der genau das macht,
was ich mir vorgestellt habe:
http://www.menucool.com/slider/jquery-slider-lightbox
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: http://referenzen
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:
http://referenzen
Vielleicht kennt ja hier jemand die Lösung. Das wäre toll!
Viele Grüße
Petra
So sieht der Code aus:
ich habe einen Slider gefunden, der genau das macht,
was ich mir vorgestellt habe:
http://www.menucool.com/slider/jquery-slider-lightbox
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: http://referenzen
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:
http://referenzen
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>