jQuery 如何实现延迟滑动？

发布于 2025-01-03 07:08:41 字数 252 浏览 0 评论 0原文

我正在使用以下 jQuery。 div 框向上滑动，5 秒后淡出。有没有办法实现这一点，因为该框需要很长时间才能出现。

$(document).ready(function() {
  $("#load_limit").slideUp(500); //have tried "fast" also
  $("#load_limit").delay(5000);
  $("#load_limit").slideDown(500);
});

原文

I am using the following jQuery. A div box slides up, and then after 5 seconds, fades out. Is there a way to achieve this as it takes a long time for the box to appear.

$(document).ready(function() {
  $("#load_limit").slideUp(500); //have tried "fast" also
  $("#load_limit").delay(5000);
  $("#load_limit").slideDown(500);
});

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

Oo萌小芽oO 2025-01-10 07:08:41

您可以延迟回调函数：

$(document).ready(function() {
  $("#load_limit").slideUp(500, function() {
     $("#load_limit").delay(5000).slideDown(500);
  }); 
});

或者您可以简化它：

$(document).ready(function() {
  $("#load_limit").slideUp(500)
                  .delay(5000)
                  .slideDown(500);
});

代码：http://jsfiddle.net/xjEy5/2/

You can delay in the callback function:

$(document).ready(function() {
  $("#load_limit").slideUp(500, function() {
     $("#load_limit").delay(5000).slideDown(500);
  }); 
});

or you can just simplified it:

$(document).ready(function() {
  $("#load_limit").slideUp(500)
                  .delay(5000)
                  .slideDown(500);
});

Code: http://jsfiddle.net/xjEy5/2/

回复收藏 0 原文

身边 2025-01-10 07:08:41

找到div，等待n秒，然后花费n毫秒的过渡时间向上滑动。

$("#div").delay(5000).slideUp(1000);

Find the div, wait for n seconds and then take n milliseconds transition time to slide up.

$("#div").delay(5000).slideUp(1000);

回复收藏 0 原文

想你只要分分秒秒 2025-01-10 07:08:41

您上面的代码到底有什么问题？它看起来很实用（除了您在说明中指出的那样有 SlideDown/slideUp 并且没有 fadeOut 之外）

以下是实现相同效果的另一种方法：

jQuery(function($) { // same as $(document).ready() but no conflicts :)

   $('#load_limit').slideDown(500, function() {
      var self = this;
      setTimeout(function() {
         $(self).fadeOut(500);
      }, 5000);
   });

});

What exactly is wrong with the code you have above? It looks functional (other than you have slideDown/slideUp and no fadeOut as you indicated in the instructions)

Here's an alternative way to achieve the same effect:

jQuery(function($) { // same as $(document).ready() but no conflicts :)

   $('#load_limit').slideDown(500, function() {
      var self = this;
      setTimeout(function() {
         $(self).fadeOut(500);
      }, 5000);
   });

});

回复收藏 0 原文