實用的JQuery列隊動畫demo

<!-- css -->ul{
 list-style: none; 
}
li{
 font-size: 25px;
 float: left;
 color:grey;
 position: relative;
 margin: 10px;
 opacity: 0;
 left: -200px;
}<!-- html --><ul>
 <li>歡</li><li>迎</li><li>來</li><li>到</li><li>這</li><li>里</li></ul><!-- js -->$("li").last().animate({
 opacity: '1',
 left: '200px'
 },400,function fn(){
 $(this).prev().animate({
 opacity: '1',
 left: '200px'
 },400,fn)
 })
 setTimeout(function(){
 $("li").last().animate({
 opacity: '0',
 left: '400px'
 },400,function fn(){
 $(this).prev().animate({
 opacity: '0',
 left: '400px'
 },400,fn)
 })
 },2500)