Javascript: Klickbare Slideshow mit Easing-Animation

2nd

Aktives Mitglied
Thread Starter
Dabei seit
25.07.2004
Beiträge
9.018
Reaktionspunkte
243
Moin,

ich möchte gerne folgendes umsetzen: Es werden 3-4 Bilder geladen, eines wird angezeigt und im Bild sind Vor/Zurück-Buttons. Klicke ich auf diese, werden die anderen Bilder angezeigt.

Allerdings möchte ich das Ganze animiert haben, am besten mit Easing-Effekten. Das heisst, wenn man auf den Vorwärts-Button klickt, wird das aktuelle Bild nach links rausgefahren und das nächste wird reingeslidet - dabei wird die Animation am Ende langsamer.

In Actinscript habe ich schon öfters solche Minigallerien umgesetzt, in JS bin ich allerdings nicht so fit. Am liebsten würde ich dieses Problem mit einem JS-Framework lösen, z. B. jQuery.

Meine Frage: Bieten jQuery oder die moo.tools oder ein anderes FW solche Funktionen an, evtl. auch mit Plugins?

Danke,

2nd
 
Lösung mit jQuery

Die Teile heißen „carousel“. Gibt's in allen möglichen JS-Frameworks. Das, was Du brauchst hört sich nach dem „simple carousel“ im oben verlinkten Dokument an.
 
Lass uns am Ergebnis teilhaben!
 
Jakob! Genau das ist die Lösung, die ich suche :)

Zehntausenddank!!!

Vielleicht stelle ich es hier rein, wenn die Seite online ist...

2nd
 
Freut mich. Happy Surfing!
 
Danke für den Link, Jakob!

Kollege - bin gespannt, was du draus machst :teeth:
 
Ich habe das Karussell übrigens heute vormittag eingebaut - 2 Stunden, dann war alles genau 100% so, wie ich es mir vorgestellt habe, inkl. vollständiger Integration in mein eigenes Layout. Tolles Skript!

Die Seite ist aber noch nicht online, sind noch andere Sachen zu tun...

Danke nochmal!

2nd
 
Würde so etwas auch gerne bei einem Projekt einsetzen. Allerdings ein wenig anders.

Ich verwende die Lightbox 2 um die Bilder in einer Galerie in Originalgrösse anzuzeigen. Nun suche ich solch einen Carousel-Effekt in der Lightbox.
Bekommt man sicherlich hin, aber vlt. kann ich mir die Arbeit ja sparen. Hat sowas schon mal jemand gesehen?

Ich hab's über http://AjaxRain.com/ gefunden. Empfehlenswerte Seite für hochwertige Scripts.

Schöne Sammlung. Ist gebookmarkt. Danke. :)
 
Carousel hat selbst eine Lightbox Variante am Start - allerdings klassisch (Thumbs unter dem grossen Bild).

Ansonsten kann ich folgenden Link hier mal reinwerfen:

Imageflow -> http://194.95.111.244/~countzero/scripts/_myImageFlow/

Ist eine Art Coverflow auf JS-Basis - auch ganz knorke.

Nicht genau das, was Du suchst, aber mit entsprechender Skalierung der Bilder kommt es dem nahe.

2nd
 
Carousel hat selbst eine Lightbox Variante am Start - allerdings klassisch (Thumbs unter dem grossen Bild).
Das wäre evtl. sogar besser. Zielgruppe sind ältere Menschen, da muss nicht alles sliden und flutschen. :)
Du meinst aber nicht das Thickbox-Beispiel auf der oben verlinkten Seite? Ich schau mir das aber morgen mal genauer an. Dank Dir.
 
Zurück
Oben Unten