javascript - Time difference between fadeIn() delay() and fadeOut() -

i trying calculate time difference moment command line (3) starts , ends, looks wrong, line(7) shows zero. expecting show 6500 (1500 + 3500 + 1500). please me.

sd = new date();  sdm = sd.getmilliseconds(); $(imgs).eq(i).fadein(1500).delay(3500).fadeout(1500); ed = new date();  edm = ed.getmilliseconds(); df = edm - sdm; document.getelementbyid('df').innerhtml = df; 

the reason throwing question is, writing slideshow (very simple) , not showing images in sequence jumps 1 another.

this html , js.

    $(document).ready(       function() {              var i=0;             var imgs = $('#images ul').children();             var j = imgs.length;              setinterval(function(){ runit(); }, 6500);              function runit() {                 = + 1;                 if (i == j) { i=0;}                  $(imgs).eq(i).fadein(1500).delay(3500).fadeout(1500);             }      });   <div id="slider">     <ul>         <li><img src="images/slider/s1.jpg" /></li>         <li><img src="images/slider/s2.jpg" /></li>         <li><img src="images/slider/s3.jpg" /></li>         <li><img src="images/slider/s4.jpg" /></li>     </ul>    </div> 

thank you.

calls animating functions in jquery asynchronous. need use callback function, so:

$(element).fadeout(delay,     function() {         // callback action     } ); 

however, not work expected. getmilliseconds returns milliseconds have passed since beginning of second, e.g., if current time 20:18:20.430, return 430. want use method gettime instead. returns number of milliseconds since unix epoch.

since using jquery, instead of document.getelementbyid'ing, can use more concise $('#id').html('...');. leaves with:

sd = new date();  sdm = sd.gettime(); $(imgs).eq(i).fadein(1500).delay(3500).fadeout(1500,     function() {         ed = new date();          edm = ed.gettime();         df = edm - sdm;         $('#df').html(df);     } ); 

your slideshow messed because of this.

a small nitpick regarding second snippet: in var imgs = $('#images ul').children();, .children() method returns jquery object. needn't run through $() again, can if think that's more clear.

imgs.eq(i).fadein(1500).delay(3500).fadeout(1500);