js/jquery help

Soldato
Joined
12 May 2007
Posts
3,896
Location
Bristol
I've come across this little jquery function which simply rotates through divs and sets them to show. However, I need it to repeat back to the first div once it reaches the end but have no clue how to do so. Can anyone point me in the right direction.

Code:
$.fn.cycle = function(timeout){
    var $all_elem = $(this)

    show_cycle_elem = function(index){
        if(index == $all_elem.length) return; 
        $all_elem.hide().eq(index).fadeIn()
        setTimeout(function(){show_cycle_elem(++index)}, timeout);
    }
    show_cycle_elem(0);
}

$(document).ready(function() {
	$("#signs a").cycle(1000)
});

Edit: I got it working. However, is there a better way to do it?

Code:
$.fn.cycle = function(timeout){
    var $all_elem = $(this)

    show_cycle_elem = function(index){
        if(index == $all_elem.length) return show_cycle_elem(0); 
        $all_elem.hide().eq(index).fadeIn()
        setTimeout(function(){show_cycle_elem(++index)}, timeout);
    }
    show_cycle_elem(0);
}
 
Last edited:
Thanks, I'll give that a go.

Would you mind checking over this as well? I have a premade FAQ accordion but needed to add an Open All/Close All button and this mess below is what I came up with. It works fine but being fairly new to creating my own jquery, I'm not sure if I've done it the 'right' way.

Code:
$(document).ready(function() { 
	$("h3.openall").click(function(){
		$('h3.hideall').show();
		$("h3.openall").hide();
		$("dl#faq dt").toggleClass("selected");
		$("dl#faq dd").animate({ height: "show" }, 500, "linear");return false;
	});	
	$("h3.hideall").click(function(){ 
    	$("dl#faq dt").toggleClass("selected");
		$("h3.hideall").hide();
		$('h3.openall').show();
		$("dl#faq dd").animate({ height: "hide" }, 500, "linear"); return false;
	});
});
 
Back
Top Bottom