Nicus Blog

Gestern musst ich für eine Website ein Bilder Karussell erstellen. Dabei wollte ich kein Flash sondern jQuery benutzen. Das Karussell sollte 2D und sehr einfach sein. Auf der Suche nach einer guten Grundlage fand ich jCarousel Lite. Mit diesem sehr kleinen jQuery Plugin ist es möglich sehr verschiedene Image Slider zu gestalten. Dabei werden Optionen wie automatische Schlaufen und mehr als ein paar Bilder nach vorne und zurück unterstützt. Für mich war wichtig, das Bilder Karussell auch mit einem Mouseover zum drehen zu bringen. Dafür waren nur kleine Änderungen nötig.

Diesen Code Abschnitt löschen.

if(o.btnPrev)
$(o.btnPrev).click(function() {
return go(curr-o.scroll);
});if(o.btnNext)
$(o.btnNext).click(function() {
return go(curr+o.scroll);
});

Diesen Code an dieser Stelle einfügen:

if(o.btnPrev)
$(o.btnPrev).mouseover(function() {
t=setInterval(function() {
go(curr-o.scroll);
}, o.auto+o.speed);
});
$(o.btnPrev).mouseout(function() {
clearInterval(t)
});if(o.btnNext)
$(o.btnNext).mouseover(function() {
t=setInterval(function() {
go(curr+o.scroll);
}, o.auto+o.speed);
});
$(o.btnNext).mouseout(function() {
clearInterval(t)
});

Danach sollte das jQuery Bilder Karusell auch ohne Klick funktionieren.