延迟JQuery效果

时间:2008-10-30 18:16:34

标签: javascript jquery effects

我希望在延迟几秒后淡出一个元素及其所有子元素。但我没有找到一种方法来指定效果应该在指定的时间延迟后开始。

6 个答案:

答案 0 :(得分:77)

setTimeout(function() { $('#foo').fadeOut(); }, 5000);

5000是五秒(毫秒)。

答案 1 :(得分:43)

我使用我刚写的暂停插件

$.fn.pause = function(duration) {
    $(this).animate({ dummy: 1 }, duration);
    return this;
};

这样称呼:

$("#mainImage").pause(5000).fadeOut();

注意:您不需要回调。


编辑:您现在应该使用jQuery 1.4. built in delay()方法。我没有检查,但我认为它比我的插件更“聪明”。

答案 2 :(得分:19)

以前你会做这样的事情

$('#foo').animate({opacity: 1},1000).fadeOut('slow');

第一个动画没有做任何事情,因为你已经在元素上有不透明度1,但它会暂停一段时间。

在jQuery 1.4中,他们已经将它构建到框架中,因此您不必像上面那样使用hack。

$('#foo').delay(1000).fadeOut('slow');

该功能与原始jQuery.delay()插件http://www.evanbot.com/article/jquery-delay-plugin/4

相同

答案 3 :(得分:11)

最好的方法是使用jQuery延迟方法:

$( '#添加my_id')延迟(2000).fadeOut(2000);

答案 4 :(得分:1)

您可以使用fadeTo()方法避免使用setTimeout,并设置5秒延迟。

$("#hideAfterFiveSeconds").click(function(){
  $(this).fadeTo(5000,1,function(){
    $(this).fadeOut("slow");
  });
});

答案 5 :(得分:1)

我写了一个插件,让你在链中添加一个延迟。

例如$('#div')。fadeOut()。delay(5000).fadeIn(); //淡出元素,等待5秒,淡入元素。

它不使用任何动画黑客或过多的回调链,只是简单干净的短代码。

http://blindsignals.com/index.php/2009/07/jquery-delay/