延迟弹出10秒,只弹出一次

Question

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

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

如何修改它,以便在20秒之后自动弹出？但是一旦关闭它就不会再出现了.

Answer 1

实际上,之前发布的解决方案都没有在现实生活中发挥作用,为什么？因为这条线:

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

不触发fancybox,它只是将fancybox绑定到选择器#various1,但它仍然需要点击才能触发模态/灯箱(不是弹出窗口).顺便说一句,Gearóid的解决方案无论如何都有语法错误.唯一真正的价值是他们建议使用jQuery cookie插件(旧网站).

编辑:(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,请在此处检查现有错误和解决方法

PS.fancybox不是一个弹出窗口,而是一个模态/灯箱jQuery插件,从UI的角度来看,这是一个非侵入式的解决方案,如jGrowl.