Jquery Modal Fade Delay

时间:2015-01-24 09:29:23

标签: jquery fade

我使用jquery-reveal.js弹出一个点击链接后消失的弹出窗口。我现在要做的是从点击链接到淡入淡出开始时有一段延迟我已经识别出调用淡入淡出的代码片段,但是我无法让延迟工作。我将把超时放在哪里?

if(options.animation == "fade") {
                modalBG.delay(options.animationspeed).fadeOut(options.animationspeed);
                modal.animate({
                    "opacity" : 0
                }, options.animationspeed, function() {
                    modal.css({'opacity' : 1, 'visibility' : 'hidden', 'top' : topMeasure});
                    unlockModal();
                });                 
            }   

2 个答案:

答案 0 :(得分:0)

modalBG.delay(3000)

会给你一个3秒的延迟

答案 1 :(得分:0)

以通用方式,要在任何方法调用之前设置延迟,您可以使用标准JavaScript setTimeout方法。

setTimeout(function()
{
    $('#MyModal').fadeOut();
}, 2000);

上面的代码将执行jQuery的fadeOut调用,延迟时间为2秒。


<强>更新

看了jQuery Reveal的文档后,我猜我发现了:

setTimeout(function()
{
    $('#MyModal').trigger('reveal:close');
}, 2000);


此外,重要的是要记住Reveal是一个jQuery插件,可能无法与delay()一起使用,因为它执行的另一个操作可能不在效果队列中,因此,他们不会被推迟。

来自jQuery API文档

  

它可以与标准效果队列一起使用,也可以与自定义队列一起使用。只有队列中的后续事件才会延迟;例如,这不会延迟不使用效果队列的.show()或.hide()的无参数形式

另外:

  

.delay()方法最适合延迟排队的jQuery效果。因为它是有限的 - 例如,它没有提供取消延迟的方法 - .delay()不能替代JavaScript的原生setTimeout函数,这可能更适合某些用例