JQuery输入动画
JQuery Entering Animation
我试图得到的效果,当我的页面加载,我的div飞在一个接一个。现在飞行是有效的,但是所有的东西都是同时飞进来的,我希望它们一个接一个地飞进来。
我的代码是这样的:
<script>
function animateEnter( object ){
object = $("#"+object);
object.css("left","1000px");
object.animate({
left: "0px"
});
}
</script>
<div id="1"></div>
<script>
animateEnter("1");
</script>
<div id="2"></div>
<script>
animateEnter("1");
</script>
<div id="3"></div>
<script>
animateEnter("1");
</script>
try
var count=0;
var delay=1000;
function animateEnter( object ){
object = $("#"+object);
object.css("left","1000px");
fly(object);
}
function fly(object){
count++;
setInterval(function(){
$(object).animate({
left: "0px"
},delay);
},(count*delay));
}
尝试使用setTimeout
function animateEnter(object, time){
setTimeout(function(){
object = $("#"+object);
object.css("left","1000px");
object.animate({
left: "0px"
});
},
time
);
}
这里是JSFiddle
不需要处理超时或任何东西。只需像这样使用animate
的callback
函数: