Can one set different delay per item in caroufredsel?

Question

Is there a way when using the auto configuration in caroufredsel (caroufredsel) to specify different delays per item so that for example one can have:

• 1st Item - 5 seconds
• 2nd Item - 10 seconds
• 3rd Item - 8 seconds
• ...

Answer 1

While working on a website I had a similar problem. The carousel contains an animation and some additional information as static slides. The duration of the animation exceeds by far the time needed to read the content of the other slides, so I wanted to set a different timeout for the animation.

The solution is somewhat hidden in the documentation on the code examles page for custom events in the section 'the configuration-event'.

You can access and edit the configuration object via

$('#carousel').triggerHandler('configuration')

and actually assign different timeoutDuration values depending on the item(s) to be shown, for example in the onBefore event handler of the scroll object:

...
scroll: {

    onBefore: function(data){

        if(data.items.visible[0].id == 'animation'){
            t = 30000;
        }
        else {
            t = 5000;
        }
        $('#carousel').triggerHandler('configuration').auto.timeoutDuration = t;
    },
...