javascript - 消除隐藏延迟

标签 javascript jquery image delay

(function($)
{
 $.fn.blink = function(options)
 {
  var defaults = { delay:5000 };
  var options = $.extend(defaults, options);

  return this.each(function()
  {
   var obj = $(this).find("img");
   setInterval(function()
   {
    if($(obj).css("display") == "block")
    {
     $(obj).fadeOut('slow');
    }
    else
    {
     $(obj).fadeIn('slow');
    }
   }, options.delay);
  });
 }
}(jQuery))

$('.blink').blink();

HTML:

<a href="#" class="blink">
    <img src="image.png" alt="some image" />
</a>

该脚本删除具有过渡效果的图像,然后将其显示回来。所以这里有两个步骤:1)隐藏,2)显示。

每一步有 5 秒的延迟,只有当图像可见时才应该延迟。

如何消除隐藏步骤中的延迟?当图像不可见时不应有任何延迟。

代码可在 JsFiddle 上获取

它是一个循环脚本,一旦淡入/淡出完成,就应该重新开始。

谢谢。

最佳答案

要消除 fadeOut 后的延迟,只需链接调用,而不是按自己的时间间隔调用它们:

$(obj).fadeOut('slow').fadeIn('slow');

我对代码做了一些简化:http://jsfiddle.net/vcWDy/2/

关于javascript - 消除隐藏延迟,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4480490/

相关文章:

javascript - 在 Socket.io 中访问 i18n

javascript - 无法通过 Object.property 访问 Javascript 中的 JSON 元素

css - DIV 中的绝对值

javascript - Twitter typeahead 要显示的不同值

javascript - 删除组件之间的空间

javascript - 停止闪烁重新加载 iframe

javascript - 将具有不同尺寸的并排图像动态调整为相同高度

css - 如何使用图片的一部分作为缩略图而不将其大小调整为缩略图

javascript - 使用 jQuery 附加到 ID 解析 JSON YQL 输出

javascript - 在 Google Analytics 事件跟踪代码中使用 Javascript 来自动化类别命名