延迟弹出 60 秒

Question

我正在使用以下脚本在我客户的页面上弹出一个弹出窗口。她要求延迟 60 秒。我正在使用 setTimeout ，但我在实施时遇到了问题。它正在延迟 #mask，但不会延迟 #boxes #dialog

您可以在此处查看站点：http://www.julialucille.com/

如有帮助，将不胜感激，谢谢！这是我的脚本。

$(document).ready(function() {  

    setTimeout(function(){
        var id = '#dialog';

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

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

        //transition effect     

        $('#mask').fadeTo("slow",0.3); 
        $('#boxes #dialog').fadeTo("slow"); 

    }, 60000);

    //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

确保#mask和#dialog在CSS中都设置为display: none;，然后根据以下脚本使用setTimeout

$(document).ready(function() { 

  setTimeout(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').fadeTo("slow",0.3); 
    $(id).fadeTo("slow", 1); 

  }, 30000);

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

});

延迟弹出 60 秒

Delay popup 60 seconds

javascript

jquery

delay

popover