在整个网站上弹出 Div？（在第一个页面加载时）答案

【问题标题】：Popup Div Over Entire Website? (On first pageload)在整个网站上弹出 Div？（在第一个页面加载时）
【发布时间】：2012-02-28 14:25:39
【问题描述】：

我没有创建介绍页面，而是尝试在整个网站上显示一个 div，其中包含背景图片、一些文本、倒计时和退出按钮。有没有办法只为一个 IP 地址显示这个 div 一定次数？这样它加载一次 div 看起来像这样。

<div id="divbgimg">
<span id="titletext">text text text</span>
<span id="subtitletext">text text text</span>
<span id="date">10/11/12</span>
<div id="countdown"></div>

有没有我应该看的 jQuery 脚本来做这样的事情？

【问题讨论】：

我最喜欢的小毛病之一。

标签： jquery css html cookies

【解决方案1】：

看看 Reveal - http://www.zurb.com/playground/reveal-modal-plugin

【讨论】：

【解决方案2】：

如果我理解正确的话，JQuery 模态对话框之类的东西可能就是你所追求的。看这里

http://jqueryui.com/demos/dialog/#modal

【讨论】：

【解决方案3】：

您可以使用setTimeout 或延迟function 功能。您可以在一定时间后隐藏您的 div

setTimeout(function() {
  $('#divbgimg').fadeOut();
}, 1000)//100ms

【讨论】：

【解决方案4】：

您需要显示 div，然后设置一个 cookie 来声明您访问过该页面...

http://www.electrictoolbox.com/jquery-cookies/

然后当你下次访问该页面时，检查 cookie 是否存在并且（如果存在），不要显示 div 覆盖。

【讨论】：

【解决方案5】：

我喜欢这样做：

HTML：

<div id='lb_background'></div>
<div id='lb_front'>This is where your content will go!<div id="countdown"></div></div>

CSS：

#lb_background {
position: absolute; /*THIS IS REQUIRED!*/
height: 100%;
width: 100%;
background-color: black;
z-index: 1000; /* In front of everything */
opacity: 0.6;
}
#lb_front {
padding: 20px;
z-index: 1001; /* In front of lb_background */
position: absolute;
top: 50px;
}

jquery：

$('#lb_background').click(function(){
   $('#lb_background, #lb_front').fadeOut(200)
});

编辑以上只是我用来轻松创建灯箱的方法。至于倒计时和定时器就略有不同了。

JQuery:

$(function(){
  var count = 10;
  countdown = setInterval(function(){
    $("#countdown").html(count + " seconds remaining!");
    if (count == 0) {
      $('#lb_background, $lb_front').fadeOut(200);
    }
    count--;
  }, 1000);
});

（来自：How can I make a jQuery countdown）

【讨论】：