jQuery show after time

[Craig Hopson]

hi guys i'm using this

<script type="text/javascript">  $('#test').addClass('js');$(function() {  var timer = setInterval( showDiv, 2000);  var counter = 0;  function showDiv() {	if (counter ==0) { counter++; return; }	$('#div1, #div2, #div3, #div4, #div5, #div6, #div7')	  .stop()		  .filter( function() { return this.id.match('div' + counter); })  	  .show('fast');	counter == 7? counter = 0 : counter++;	    }});</script>

to show #div1, #div2 ect One after another Question:- How do i make it hide them all 20 seconds after the last one shows and restart? Thanks guys

Edited July 2, 2012 by Craig Hopson

[Craig Hopson]

SOLVED like this

<script type="text/javascript">  $('#test').addClass('js');$(function() {  var timer = setInterval( showDiv, 1000);  var counter = 0;  function showDiv() {    if (counter ==0) { counter++; return; }    $('#div1, #div2, #div3, #div4, #div5, #div6, #div7')	  .stop()	 	  .filter( function() { return this.id.match('div' + counter); })  	  .show('fast');	 counter == 10? counter = 0 : counter++;	 if(counter == 10){		 $('#div1, #div2, #div3, #div4, #div5, #div6, #div7').hide('slow');	 counter = 0;	 } 	  }});</script>

[astralaaron]

That works, you can also use the callback to make them fire off one after eachother with a timeout for the delay

[Craig Hopson]

ok new problem

$('#div1, #div2, #div3, #div4, #div5, #div6, #div7').hide('slow');

any think i put in hide like 'slow', 'fast', or 'fade', {}, 1000dont work any idea?

[justsomeguy]

What does the documentation say you're supposed to pass to the hide method?

[dsonesuk]

setting duration for hide produces a slide up effect, if you are looking fade out effect, use .fadeOut('slow') 'slow' equal approx 650ms, 'fast' equals approx 400ms