Question

Right so before I get started with my question I have set up the code in jsFiddle;

Right…

1. There is a default cycle running through the existing 6 options no problem!

2. Inside each slide there are an a various number of spans, which remain dormant until it’s pager is hovered.

   1. You will see that there is an alert, this displays the number of spans in the relevant slide – doesn’t work correctly as it doesn’t seem to like the reset. Doesn’t need to be fixed, this is just for testing purposes.
   2. Automation seems to cycle through the spans perfectly fine, this is good – but the timer seems to not work properly.
   3. Slides which have just one span seem to dis-regard the if statement n>1 and they cycle through regardless.

Greatly appreciate any help getting items 2/3 fixed!!!

Answer 1

Don’t worry I fixed it.

http://benalman.com/projects/jquery-dotimeout-plugin/ This helped with the main problem, but wasn’t working in Internet Explorer so I used browser detect.

The working js can be found below for future reference.

if ( $.browser.msie ) {
    function nextSlide() {
            var active = $("#slides .activeInner img.active");
            var next   = active.next();
            if (next.length === 0) {
                var next = $('#slides .activeInner img:first');
            }

            active.removeClass('active').css('display','none');
            next.addClass('active').css('display','block');
    }

    setInterval(nextSlide, 5000);
} else {
    $.doTimeout('loop',5000,function() {
        var active = $("#slides .activeInner img.active");
        var next   = active.next();
        if (next.length === 0) {
            var next = $('#slides .activeInner img:first');
        }

        active.removeClass('active').css('display','none');
        next.addClass('active').css('display','block');
        return true;
    });
}