JQuery jak zapętlić funkcję?

0

Witam wszystkich.
Problem jak w temacie. Sytuacja wygląda tak:
Mam html w postaci:

<div id="box">
	<p>	aaa	</p>
	<p>	bbb	</p>
	<p>	ccc	</p>
</div>
 

Do tego css:

 
body
{
	background: #2a2a2a;
	margin: 0;
	padding: 0;
}

#box
{
	margin: 0 auto;
	padding: 0;
	width: 1224px;
	height: 1000px;
}

p
{
	color: white;
	width: 600px;
	height: 100px;
	margin: 0 auto;
	padding: 0;
}

I na końcu skrypt JQuery a w nim funkcja biegaj() która pokazuje mi kolejne paragrafy (na razie metodą "łopatologiczną"):

$(function(){

	    function biegaj(){
	      $('#box').children().eq(0).delay(1000).fadeIn(1000).delay(1000).fadeOut(1000, function(){
	        $('#box').children().eq(1).delay(1000).fadeIn(1000).delay(1000).fadeOut(1000, function(){
		  $('#box').children().eq(2).delay(1000).fadeIn(1000).delay(1000).fadeOut(1000);
		  });
	       });
	    }
	    
	    $('#box').children().hide();
	    biegaj();	
	});

Mój problem polega na tym że wywołanie biegaj() wyświetla jeden cykl a ja chciałbym go powtarzać w nieskończoność. Jak to zrobić?

1

przelicz sobie kiedy animacja się kończy i na końcu biegaj() zrób: setInterval(biegaj, 6000); (zamiast 6000 - czas, w ktorym animacja sie konczy).

0

dzięki dzek69 zadziałało :) ale w między czasie chwilę odetchnąłem i wpadłem na bardziej elegancki sposób :)

var i=0;
	    function biegaj(t_empty,t_fade,t_show){
	    	$('#box').children().eq(i).delay(t_empty).fadeIn(t_fade).delay(t_show).fadeOut(t_fade, function (){
	    		i=(i+1)%3;
			biegaj(t_empty,t_fade,t_show);
	    	});
	    
	    }
	    
	    $('#box').children().hide();
	    biegaj(250,500,3000);
0

Jeszcze mała uwaga, staraj się jak najmniej odwoływać do DOMu, więc lepiej jak zdefiniujesz $('#box') jako zmienna na początku, o ile w drugim przykładzie to ujdzie, to w pierwszym może znacznie spowalniać(w 2gim przypadku this mile widziane)

1 użytkowników online, w tym zalogowanych: 0, gości: 1