我想让这个模式窗口在页面加载后 10 秒后出现..谢谢大家答案

【问题标题】：I want to make this modal window appear after 10seconds when the page has loaded..tnx everyone我想让这个模式窗口在页面加载后 10 秒后出现..谢谢大家
【发布时间】：2011-03-11 02:36:19
【问题描述】：

$(document).ready(function() {

    var id = "#dialog";

    //Get the screen height and width
    var maskHeight = $(document).height();
    var maskWidth = $(window).width();

    //Set heigth and width to mask to fill up the whole screen
    $('#mask').css({'width':maskWidth,'height':maskHeight});

    //transition effect     
    $('#mask').fadeIn('fast');  
    $('#mask').fadeTo('fast');  

    //Get the window height and width
    var winH = $(window).height();
    var winW = $(window).width();

    //Set the popup window to center
    $(id).css('top',  winH/2-$(id).height()/2);
    $(id).css('left', winW/2-$(id).width()/2);

    //transition effect
    $(id).fadeIn('fast');   

//if close button is clicked
$('.window .close').click(function (e) {
    //Cancel the link behavior
    e.preventDefault();
    $('#mask').fadeOut();
    $('.window').fadeOut();
});     

//if mask is clicked
$('#mask').click(function () {
    $(this).unhide();
    $('.window').unhide();
});

});

【问题讨论】：

一般来说，您应该在正文中提出您的问题并使用描述性标题。您发布的代码与您明显的问题无关，因此投反对票。

标签： javascript jquery dialog window modal-dialog

【解决方案1】：

加载文档时隐藏模态窗口，使用 setTimeout() 方法显示，div

检查此代码。

 $(document).ready(
    function(){
        $("#dialog").hide();
        setTimeout(function(){
            $("#dialog").show();
        }, 10 * 1000);  
    }
);

【讨论】：

在上面的脚本中我应该在哪里插入 setTimeout()？因为 var id="#dialog";是加载页面时显示的 div..
请检查代码提示的编辑答案。我还没有检查它，但它应该适合你。

【解决方案2】：

要在延迟后执行功能，您可以使用window.setTimeout(fun, milliseconds)。通常将此与匿名函数一起使用。例如，如果您想在页面加载 10 秒后执行某项操作：

$(function()
{
    setTimeout(function()
    {
        alert("Something");
    }, 10 * 1000);
});

【讨论】：

在上面的脚本中我应该在哪里插入 setTimeout()？因为 var id="#dialog";是页面加载时显示的 div。
简短的回答是将所有从var id = ... 到$(id).fadeIn(... 的行包装在一个通过setTimeout 调用的匿名函数中。这不是最好的解决方案，但如果您以前从未使用过 JavaScript，那么这可能是最简单的方法。
我还是这个 js 的新手.. =(

【解决方案3】：

关于上面的代码只需粘贴

//set a delay on load
$('#mask').delay(5000);

就在下面的代码之后

//Set heigth and width to mask to fill up the whole screen
$('#mask').css({'width':maskWidth,'height':maskHeight});

粘贴之后

//set a delay on load
$(id).delay(5000);

就在之前

//transition effect
$(id).fadeIn(2000);

我希望这会有所帮助。

【讨论】：