Content Slider mehrmals in einer Seite verwenden?
Ich möchte gerne das Modul Contentslider mehrmals in verschieden größen in einer Webseite verwenden. Genau gesagt einmal in der Linken Spalte und einmal in der main Spalte. Das Modul in der main Spalte habe ich ganz normal über die Artikel angelegt und den Elementen die ID slideElem zugewiesen. Soweit funktioniert auch alles einwandfrei.
Für den Contentslider in der linken Spalte habe ich eines Neues Modul "Eigener HTML code angelegt und mir den entsprechenden Code Kopiert und die ID "slideElem" in slideWrapper_projekte und die Klasse "slideElem" in slideElem_projekte umbenannt. Dann habe ich in meiner CSS Datei folgende angabe gemacht:
Code:
#slideWrapper_projekte { width: 195px; height: 120px; overflow: hidden; }
div.slideElem_projekte { width: 195px; height: 120px; float: left; }
Danach habe ich im Javascript alle Variablen verändert und die Datei mit einen Link im Headbereich eingebunden. Das Script sieht jetzt so aus.
Code:
var prevElementx;
var nextElementx;
var currElementx;
var slideElementsx = new Array();
var elementBaseSizex = 195;
function getnextElementx() {
for (x = 0; x < slideElementsx.length; x++) {
if (slideElementsx[x] == currElementx) {
if ((x + 1) < slideElementsx.length)
nextElementx = slideElementsx[x + 1];
else
nextElementx = slideElementsx[0];
}
}
}
function getprevElementx() {
for (x = 0; x < slideElementsx.length; x++) {
if (slideElementsx[x] == currElementx) {
if ((x - 1) >= 0)
prevElementx = slideElementsx[x - 1];
else
prevElementx = slideElementsx[slideElementsx.length - 1];
}
}
}
window.addEvent("domready", function() {
var sliderx = new Fx.Scroll('slideWrapper_projekte', {
wait: false,
duration: 1500,
transition: Fx.Transitions.linear });
var objSliderx = document.getElementById("innerSlideWrapper2");
var objElemx = objSliderx.getElementsByTagName("div");
for(x = 0; x < objElemx.length; x++) {
if (objElemx[x].className.indexOf("slideElem_projekte") > 0) {
objElemx[x].id = "sliderContentx" + x;
slideElementsx.push("sliderContentx" + x);
}
}
$('innerSlideWrapper2').setStyle("width", elementBaseSizex * slideElementsx.length);
currElementx = slideElementsx[0];
getprevElementx();
getnextElementx();
$('goBack').addEvent('click', function(event) {
event = new Event(event).stop();
sliderx.toElement(prevElementx);
currElementx = prevElementx;
getprevElementx();
getnextElementx();
});
$('goForward').addEvent('click', function(event) {
event = new Event(event).stop();
sliderx.toElement(nextElementx);
currElementx = nextElementx;
getprevElementx();
getnextElementx();
});
});
Soweit funktioniert es auch bis auf:
Das Problem was ich jetzt noch habe ist wenn ich in der Linken Spalte den Content Sliden möchte auch der Mainbereich Slidet. Ich habe leider keine Ahnung von Javascript deshalb würde es mich echt freuen wenn mir jemand hierbei weiterhelfen kann.
