延迟弹出10秒，仅弹出一次 [英] Delay pop-up for 10 seconds, only pop up once

问题描述

我正在使用fancybox内联弹出窗口来提醒视图促销.我为此使用的代码是:

$(document).ready(function() {
  $("#various1").fancybox();
});

我将如何修改它，使其在20秒后自动弹出?但是一旦关闭，它就不会再次弹出.

解决方案

实际上，以前发布的解决方案都没有在现实生活中起作用，为什么? 因为这行:

$("#various1").fancybox();

不会触发fancybox，它只是将fancybox绑定到选择器#various1，但仍然需要单击以触发模式/灯箱(不是弹出窗口).顺便说一句，Gearóid的解决方案仍然存在语法错误.唯一真正的价值在于，他们建议使用 jQuery cookie插件(旧网站). /p>

编辑 :( 2012年3月7日)jQuery cookie插件首页已移动这里.

可行的解决方案的步骤:

A)在jQuery和fancybox js文件之后加载jQuery cookie插件(根据建议)

B)然后使用此脚本:

<script type="text/javascript">
function openFancybox() {
    setTimeout( function() {$('#various1').trigger('click'); },20000);
}
$(document).ready(function() {
    var visited = $.cookie('visited');
    if (visited == 'yes') {
        return false;
    } else {
        openFancybox();
    }
    $.cookie('visited', 'yes', { expires: 7 });
    $('#various1').fancybox();
});
</script>

C)您仍然需要在html代码中某个位置(可能是隐藏的)

<a id="various1" href="path/target"></a>

或用于内联内容

<a id="various1" href="#target"></a>
<div style="display: none;">
 <div id="target">message to display in fancybox</div>
</div>

此外，如果您使用内联内容和fancybox v1.3.x，请检查是否存在现有错误和解决方法

How would I modify this so it automaticly popped up after, say, 20 seconds? But once it's been closed it schouldn't pop up again.

解决方案

Actually, none of the solutions posted previously work in real life, why? because the line:

$("#various1").fancybox();

doesn't trigger fancybox, it just binds fancybox to the selector #various1, but it still needs a click to trigger the modal/lightbox (not a popup). BTW, Gearóid's solution has syntax errors anyway. The only real value is that they suggest the use of the jQuery cookie plugin (old site).

EDIT: (March 07, 2012) The jQuery cookie plugin home page moved here.

Steps for a working solution:

A) Load the jQuery cookie plugin (as suggested) after jQuery and fancybox js files

B) Then use this script:

<script type="text/javascript">
function openFancybox() {
    setTimeout( function() {$('#various1').trigger('click'); },20000);
}
$(document).ready(function() {
    var visited = $.cookie('visited');
    if (visited == 'yes') {
        return false;
    } else {
        openFancybox();
    }
    $.cookie('visited', 'yes', { expires: 7 });
    $('#various1').fancybox();
});
</script>

C) you still need to have somewhere in your html code (maybe hidden)

<a id="various1" href="path/target"></a>

or for inline content

<a id="various1" href="#target"></a>
<div style="display: none;">
 <div id="target">message to display in fancybox</div>
</div>

Also, if you use inline content and fancybox v1.3.x, check for an existing bug and workaround here

PS. fancybox is not a popup but a modal/lightbox jQuery plugin, which is a non-intrusive solution like jGrowl from a UI point of view.

这篇关于延迟弹出10秒，仅弹出一次的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！