Javascript 我如何使页面的其余部分在加载div后变为黑色，在关闭div后变为淡出？

我一直在拼凑代码，并将其与此结合起来。代码本身相当简单，基本上就是说，一旦有人第一次访问该页面，就删除一个cookie，当访问者访问该页面时，不再向其显示cookie，并且持续365天。我唯一的问题是，一旦div加载和加载，我就不知道如何淡入淡出背景，我只能淡出div本身。我试着用叠加div来包装它，但我认为我完全错了。 这里的代码看起来有点复杂，因此我附加了一个JSFIDLE作为工作示例：

**注意：一旦你拉小提琴一次，你就必须清理你的饼干。DIV只出现一次

CSS:

JS:

/给你的#welcome div一个z-index（例如11），并添加css以给出你的文档正文的完整高度和宽度：

html, body {
height: 100%;
width: 100%;
}

您将在正文中添加一个玻璃窗格div，它需要一个高度和宽度来填充页面正文，在当前示例中，没有设置高度或宽度

然后添加一个背景div，其颜色由您选择，z索引小于“欢迎”div，例如：

<div id="glass_pane" style="width: 100%; height: 100%; z-index: 10; position: absolute: top: 0px; left: 0px; background-color: #000;"></div>



Ans然后淡入淡出，根据需要将其移除，更改透明度这就是您想要的吗？我给了弹出窗口一个父容器作为覆盖

HTML
：

<div class="overlay">
    <div id="welcome">
      <span id="close"></span>
      This is the only time you will see this message :)
    </div>
</div>

jQuery
：

if ($.cookie('visited') != 'true') {
  $('#welcome, .overlay').show(100); // If the condiditon is true then show overlay
  setCookie();
} else {
  $('#welcome').remove();
}

$('#close').click(function() {
  $('#welcome').hide(100); // Can also be added to this jQuery selector but the animation was odd
    $('.overlay').fadeOut(100); // Fades out on click
});

最后是小提琴：
谢谢，这正是我想要的。我没有完全理解“覆盖”。再次感谢你的帮助！如果还有更多你不明白的地方，那就问我，我可以解释它是如何工作的！如果不是，祝你的项目伙伴好运。
<div id="glass_pane" style="width: 100%; height: 100%; z-index: 10; position: absolute: top: 0px; left: 0px; background-color: #000;"></div>

<div class="overlay">
    <div id="welcome">
      <span id="close"></span>
      This is the only time you will see this message :)
    </div>
</div>

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    z-index: 99;
}

if ($.cookie('visited') != 'true') {
  $('#welcome, .overlay').show(100); // If the condiditon is true then show overlay
  setCookie();
} else {
  $('#welcome').remove();
}

$('#close').click(function() {
  $('#welcome').hide(100); // Can also be added to this jQuery selector but the animation was odd
    $('.overlay').fadeOut(100); // Fades out on click
});