nicht angemeldet
jquery Slider mit variabler Höhe
suitHallo zusammen,
ich bin jetzt seit Stunden auf der Suche nach einem jquery Slider, der für mich passt, habe gegoogelt, implementiert und verworfen. Was ich suche ist etwas in der Art von:
http://www.gimiti.com/kltan/demo/jFlow/
Das funktioniert alles eigentlich ganz gut, mein Problem ist aber, dass meine Texte eine variable Höhe haben und man bei allen Slidern eine fixe Höhe angeben muss. Das beisst sich natürlich, insbesondere, wenn man bedenkt, dass der Benutzer ja auch seine Textgrösse ändern könnte...
Meine Anforderungen sind also:
- der Slider muss mit <div>s variabler Höhe umgehen können
- er sollte die Anzahl der <div>s erkennen und mit einem vor/zurück Button erreichbar machen, da ich die Anzahl der <div>s oft ändern werde.
Hat jemand sowas schonmal gesehen, einen Workaround oder eine Idee, wie man das Problem umgehen bzw. anders lösen kann?
liebe Grüße,
Dirk
-
Hat jemand sowas schonmal gesehen, einen Workaround oder eine Idee, wie man das Problem umgehen bzw. anders lösen kann?
Schreib dir selbst einen - ich hab kürzlich einen geschrieben - der hat exakt 26 Zeilen (bzw. 860 Bytes).
Die Sliderfunktionalität alleine in jQuery besteht aus 5 Zeilen und sieht so aus:
var index = jQuery('#switcher li').index(this);
jQuery('#switcher li:eq(' + index + ')').addClass('current');
jQuery('#switcher li:not(:eq(' + index + '))').removeClass('current');
jQuery('#scroller').stop();
jQuery('#scroller').animate({left: '-' + index*718 + 'px'}, 1000);Die erste Zeile ermittelt den Index des geklickten Tabs, die zwei weiteren setzen / bzw. entfernen die Klasse "current" vom derzeitigen Tab und die beiden letzteren sorgen für den Herumslideeffekt.
Die restlichen 21 Zeilen bestehen vorrangig aus Klammern und einer kleinen for-Schleife die ermittelt wieviele Elemente im Slider sind und aufgrund des Resultats eine Liste für die Tabs zusammenbaut.
Der Rest ist CSS.
-
Hi,
- der Slider muss mit <div>s variabler Höhe umgehen können
nachdem slider i.d.R. so funktionieren, dass ein Elternelement das "Fenster" für ein Liste von Kindelementen bildet, und alles überstehende versteckt, ist diese Anforderung vermutlich nicht zu erfüllen - zumindestens muss sich besagtes "Fenster" in der Höhe am höchsten Kind orientieren.
Gruesse, Joachim
--
Am Ende wird alles gut.-
[...] ist diese Anforderung vermutlich nicht zu erfüllen [...]
Warum sollte man nicht die höhe des umgebenden Elements nach jedem mal sliden neu berechnen - javascript ist ohnehin bereits im Spiel.
-
Hi,
Warum sollte man nicht die höhe des umgebenden Elements nach jedem mal sliden neu berechnen - javascript ist ohnehin bereits im Spiel.
Das könnte man natürlich tun, aber wie sieht dann die Animation aus? Erst wird seitlich geslided, dann in der Höhe gehüpft? Oder gleichzeitig seitlich geslidet während in der Höhe ebenfalls eine Animation läuft?
Ich würde mich da eher fragen, ob ein Slider hier wirklich Sinn macht.
Gruesse, Joachim
--
Am Ende wird alles gut.-
Erst wird seitlich geslided, dann in der Höhe gehüpft? Oder gleichzeitig seitlich geslidet während in der Höhe ebenfalls eine Animation läuft?
Mit der animate-Funktion von jQuery ist alles möglich - gleichzeitig, hintereinander (oder umgekehrt).
Ich würde mich da eher fragen, ob ein Slider hier wirklich Sinn macht.
Der Sinn dahinter erschließt sich mir auch nicht ganz - aber es ist problemlos möglich.
-
-