javascript - 如何创建覆盖以在页面加载时自动加载？

Question

<分区>

Answer 1

为此，我会使用 jQuery。在 HTML/CSS 中创建叠加层并将叠加层 div 放在标记的开头。

$(document).ready(function() {
    // check cookie
    var visited = $.cookie("visited")

    // load overlay if they haven't visited
    if (visited == null) {
        $('#overlay').fadeIn();     
        $.cookie('visited', 'yes');  
    }

    // set cookie
    $.cookie('visited', 'yes', { expires: 1, path: '/' });
});

$('button').click(function () {
    $('#overlay').fadeOut(200, "linear");
});

此代码将加载 ID 为“overlay”的 div，当单击隐藏按钮时，div 将淡出。如果您愿意，您可以通过单击叠加 div 使 div 淡出。通过使用这个:

$('#overlay').click(function () {
    $('#overlay').fadeOut(200, "linear");
});

这里有一个 fiddle 可以向您展示我的意思: http://jsfiddle.net/andaywells/jWcqZ/17/