繁体   English   中英

延迟后使jQuery弹出关闭按钮出现

[英]Make jQuery popup close button appear after a delay

我将jQuery用于弹出窗口,并且它具有关闭按钮。 我想让关闭按钮在30-60秒后显示,并显示"wait 60 seconds to close this window" 现在是代码:

var shadow = $('<div id="shadowElem"></div>');
var speed = 1000;
$(document).ready(function() {
    $('body').prepend(shadow);
});
$(window).load( function() {
    screenHeight = $(window).height();
    screenWidth = $(window).width();
    elemWidth = $('#dropElem').outerWidth(true);
    elemHeight = $('#dropElem').outerHeight(true)

    leftPosition = (screenWidth / 2) - (elemWidth / 2);
    topPosition = (screenHeight / 2) - (elemHeight / 2);

    $('#dropElem').css({
        'left' : leftPosition + 'px',
        'top' : -elemHeight + 'px'
    });
    $('#dropElem').show().animate({
        'top' : topPosition
    }, speed);

    shadow.animate({
        'opacity' : 0.7
    }, speed);

    $('#dropClose').click( function() {
        shadow.animate({
            'opacity' : 0
        }, speed);
        $('#dropElem').animate({
        'top' : -elemHeight + 'px'
    }, speed, function() {
            shadow.remove();
            $(this).remove();
        });

    });
});

尝试(我假设dropClose是关闭按钮的ID)...

CSS

#dropClose {
  display: none;
}

在打开弹出代码中

setTimeout(function() {
  $("#dropClose").show();
}, 30 * 1000);

演示希望获得帮助。.使用所需的ID或类更改ID

您需要在秒= 0后使用setInterval()和clearInterval()并更改按钮文本以关闭

$(document).ready(function(){    
    var setIt = true;
    var interval = setInterval(function(){
        if(setIt == true){
            $('#count span').text($('#count span').text() - 1);
            if($('#count span').text() == '0'){
                $('#count').text('Close This Window');
                clearInterval(interval);
                setIt = false;
            }
        }
    },1000);
});

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM