[英]How can i delay a .css function before animation
i checked other posts similar to mine, but none of the codes worked, So how can i add some delay to .css before my animation 我检查了与我类似的其他帖子,但所有代码均无效,因此如何在动画之前向.css添加一些延迟
here you can find my code below : 在这里您可以在下面找到我的代码:
$(document).ready(function() {
$('.div2')
.css('visibility', 'visible') <-- // I WANT TO ADD HERE A DELAY BEFORE THE ANIMATION THAT IS BELOW STARTS !!!!
.animate({opacity: 1.0, left: '600px'}, 2000);
$('.div2').animate({opacity: 0.0, left: '600px'}, 2000, setInvisible);
});
function setInvisible() {
$('.div2').css('visibility', 'hidden');
}
i want to delay the css, so the div will be appeared with delay, and animation will start a bit later. 我想延迟CSS,所以div将延迟出现,动画将在稍后开始。
here is the Fiddle : http://jsfiddle.net/Rroni/4b56n6p1/ 这是小提琴: http : //jsfiddle.net/Rroni/4b56n6p1/
Use .delay() as shown :- 使用.delay() ,如下所示:
$('.div2')
.css('visibility', 'visible')
.delay(1000) //this time is in milliseconds increase or decrease as required.
.animate({opacity: 1.0, left: '600px'}, 2000);
OR As per questioner comment, try using setTimeout()
as shown :- 或根据提问者的评论,尝试使用
setTimeout()
,如下所示:
$(document).ready(function() {
setTimeout(function() {
$('.div2')
.css('visibility', 'visible')
.animate({opacity: 1.0, left: '600px'}, 2000);
},1500) //this time is in milliseconds increase or decrease as required.
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.