I made a simple slide show using jquery and "setInterval() " function.

Everything working fine but I just need to start this serInterval function only after the div or page loads completely.

I will post my code here ...

1. $(document).ready(function () { 
   2. var s=setInterval('slide()',3000);
   3.  });
   4. function slide(){
   5. var pos=$("#slider").position().left;
   6. if(pos>-5400){
   7.     $("#slider").animate({"left":"-=600px"},300);
   8.     }else
   9.     $("#slider").animate({"left":"0px"},600);
  10.     }
  11. }

and my html page

<div id="imgContainer" style="width:600px;height:350px;float:left;border:3px solid #353E4D;position:relative;overflow:hidden;">
 <div id="slider" style="height:350px;float:left;width:6000px;position:absolute;left:0;"><img src="images/one.jpg" width="600" height="350" title="1" /><img src="images/two.jpg" width="600" height="350" title="2" /><img src="images/three.jpg" width="600" height="350" /><img src="images/four.jpg" width="600" height="350" /><img src="images/five.jpg" width="600" height="350" /><img src="images/six.jpg" width="600" height="350" /><img src="images/seven.jpg" width="600" height="350" /><img src="images/eight.jpg" width="600" height="350" /><img src="images/nine.jpg" width="600" height="350" /><img src="images/ten.jpg" width="600" height="350" /></div>

Friends Please go through this and help me. I tried to give a pre loader . But can't

Please help
Thanks in advance


Try this:

function slide() {
	var $slider = $("#slider");
	var pos = $slider.position().left;
	if(pos>-5400) {
	else {

$(document).ready(function() {
	var s = setInterval(slide, 3000);
//if the sliding starts too early, then try instead of the statement in $(document).ready(...)
onload = function() {
	var s = setInterval(slide, 3000);
//Note that the function can be called by name inside setInterval, without using quotes