Core code:
$(function(){
var timer = true; //Perform up or down switch
var liindex = 0; //LI index
var $div = $(".byc").find("div");
//Convert the contents of LI every three seconds
var set1 = setInterval(function(){
ainbyc($div);
liindex = 0;
timer = !timer;
},3000);
//The way LI transforms, that is, every 100ms, let the next LI move the top value;
function ainbyc(ds){
var set2 = setInterval(function( ){
//After all LIs are moved, clear them
if(liindex == $div.length){
clearInterval(set2);
//Up
}else if( timer){
ds.eq(liindex).animate({"top":0},100);
//Down
}else{
ds.eq(liindex).animate ({"top":-25},100);
}
liindex ;
},100);
}
})
Wonderful Video It’s all analyzed very clearly. Just summarize it here.
1. Clear the timer clearInterval. I wrote it outside before, but it should be written inside setInterval.
2. When you are not sure what the value of Boolean is, you can write like this: timer = !timer;
Online demo:
http://demo.jb51.net/js/2012/ mybyc/Package download:
http://www.jb51.net/jiaoben/55611.html