开发者

How to remove an element after a 3 delay?

$('#gallerie ul li:eq(1)').animate({opacity: 1}, 1250).remove(); //results in instand remove
$('#gallerie ul li:eq(1)').delay(3000).remove(); //instant remove
$('#gallerie ul li:开发者_StackOverfloweq(1)').remove().delay(3000); //that didnt work either

How can I remove the object after 3 seconds instead of being instantly removed?


setTimeout(function(){
     $('#gallerie ul li:eq(1)').remove();
},3000);


If you want to do the it .delay way, you'll need to incorporate a .queue:

$("#gallerie ul li:eq(1)").delay(3000).queue(function() {
    $(this).remove();
});

Demo: http://jsfiddle.net/karim79/MT4Yd/


The delay method is used for animations, so only animation methods that are chained after it are delayed. The delay method places a delay on the animation queue, it doesn't delay the execution of the code.

To remove elements after an animation, you can use it's callback method. Example:

$('#gallerie ul li:eq(1)').fadeOut(3000, function() {
  $(this).remove();
});


The manual page says (quite clearly, actually):

"Added to jQuery in version 1.4, the .delay() method allows us to delay the execution of functions that follow it in the queue. It can be used with the standard effects queue or with a custom queue. Only subsequent events in a queue are delayed; for example this will not delay the no-arguments forms of .show() or .hide() which do not use the effects queue."

remove() won't use the effects queue.

You can use jQuery's fadeOut(), hide() ... or as a complete equivalent to your original attempt, Javascript's basic setTimeout function.

Hope that helps.


you can do:

setTimeout(function(){
      $('#gallerie ul li:eq(1)').remove();
},3000);


how about this:

$('#gallerie ul li:eq(1)').animate({opacity: 1}, 1250,function(){
     $(this).remove();
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜