Question

我使用此代码自动显示弹出窗口，我想知道如何在5秒后自动关闭它。

$(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(500); 
    $('#mask').fadeTo("slow",0.9);  

    //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(2000);     

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

        $('#mask').hide();
        $('.window').hide();
    });     

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

});

Answer 1

修改Mozilla's developer page on WindowTimers.setTimeout()中的示例，从现有document.ready函数中调用此函数：

delayedAlertClose();

在document.ready function：

之外添加这些功能

function delayedAlertClose() {
  timeoutID = window.setTimeout(popupClose, 5000);
}

function popupClose() {
    $('#mask').hide();
    $('.window').hide();
}

一段时间后关闭弹出窗口

1 个答案: