jquery两次动画片之间是否可以设定间隔时间
日期：2014-05-16 浏览次数：20355 次
jquery两次动画之间是否可以设定间隔时间
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
#demo{ width:500px; height:150px; border:1px solid #f00; overflow:hidden; margin:auto; position:relative}
#demo ul{ padding:0px; margin:0px; width:20000px; position:relative}
#demo ul li{ display:block; float:left}
#demo ul li img{ width:200px; height:150px}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
var obj=$("#demo ul");
obj.html(obj.html()+obj.html());
function moveToleft(){
var left=obj.position().left-400;
obj.animate({left:left},1000,function(){
if(Math.abs(-obj.position().left)>=800){
obj.css({"left":"0px"});
moveToleft();
}else{
moveToleft();
}
}
);
}
moveToleft();
obj.hover(function(){
obj.stop();
},
function(){
moveToleft();
}
)
});
</script>
</head>
<body>
<div id="demo">
<ul>
<li><img src="01.jpg" ></li>
<li><img src="03.jpg" ></li>
<li><img src="04.jpg" ></li>
<li><img src="06.jpg" ></li>
</ul>
</div>
</body>
</html>
请看下我的代码
请问，每次滚动之后怎样设定停顿2秒再滚动呢
------解决方案--------------------
据说有一种计时器setTimeout(moveToleft，2000)可以实现
------解决方案--------------------
直接 delay
$('#foo').slideUp(300).delay(800).fadeIn(400);
在.slideUp() 和 .fadeIn()之间延时800毫秒。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
#demo{ width:500px; height:150px; border:1px solid #f00; overflow:hidden; margin:auto; position:relative}
#demo ul{ padding:0px; margin:0px; width:20000px; position:relative}
#demo ul li{ display:block; float:left}
#demo ul li img{ width:200px; height:150px}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
var obj=$("#demo ul");
obj.html(obj.html()+obj.html());
function moveToleft(){
var left=obj.position().left-400;
obj.animate({left:left},1000,function(){
if(Math.abs(-obj.position().left)>=800){
obj.css({"left":"0px"});
moveToleft();
}else{
moveToleft();
}
}
);
}
moveToleft();
obj.hover(function(){
obj.stop();
},
function(){
moveToleft();
}
)
});
</script>
</head>
<body>
<div id="demo">
<ul>
<li><img src="01.jpg" ></li>
<li><img src="03.jpg" ></li>
<li><img src="04.jpg" ></li>
<li><img src="06.jpg" ></li>
</ul>
</div>
</body>
</html>
请看下我的代码
请问，每次滚动之后怎样设定停顿2秒再滚动呢
------解决方案--------------------
据说有一种计时器setTimeout(moveToleft，2000)可以实现
------解决方案--------------------
直接 delay
$('#foo').slideUp(300).delay(800).fadeIn(400);
在.slideUp() 和 .fadeIn()之间延时800毫秒。
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
