Question

I've added this basic carousel to a site but cannot find code anywhere which will add a slide effect. Currently you have to click on the circles to move through the slides, but I'd like this to be automatic after 10 seconds for example.

http://sorgalla.com/jcarousel/examples/basic/

Any help would be appreciated. I'm a beginner with jQuery so go easy on me please.

Was it helpful?

Solution

I think you can use the Autoscroll plugin.

The jCarousel Autoscroll Plugin provides autoscrolling support for jCarousel.

Configuration: http://sorgalla.com/jcarousel/docs/plugins/autoscroll/reference/configuration.html

Code:

$(function () {

    $('.jcarousel').jcarousel();

    $('.jcarousel').jcarouselAutoscroll({
        interval: 1000,
        target: '+=1'
    })
});

Demo: http://jsfiddle.net/IrvinDominin/2Kspn/

Update

For infinite loop carousel use wrap option to circular:

Specifies whether to wrap at the first or last item (or both) and jump back to the start/end. Options are "first", "last", "both" or "circular" as string.

Demo: http://jsfiddle.net/IrvinDominin/2Kspn/1/

OTHER TIPS

Check Autoscroll plugin

$(function() {
    $('.jcarousel')
        .jcarousel({
            // Core configuration goes here
        })
        .jcarouselAutoscroll({
            interval: 3000,
            target: '+=1',
            autostart: true
        })
    ;
});

I hope this plugin of jcarousel will help you do your work. Autoscroll Plugin

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top