首页 > Web开发 > 详细

js 弹窗并定时关闭

时间:2019-07-04 22:24:18      阅读:339      评论:0      收藏:0      [点我收藏+]

1.

$(‘input‘).click(function() {
    prompt(‘点击成功‘, 2000)
})

function prompt(newName, time, fn) {
    var $div = $(‘<div></div>‘);
    $div.css({
        ‘position‘: ‘fixed‘,
        ‘top‘: 0,
        ‘left‘: 0,
        ‘width‘: ‘100%‘,
        ‘height‘: ‘100%‘,
        ‘z-index‘: ‘200‘,
        ‘background-color‘: ‘rgba(0,0,0,0.4)‘,
        // ‘background-color‘:‘#000‘,
    });
    var $contentDiv = $(‘<div>‘ + newName + ‘</div>‘);
    $contentDiv.css({
        ‘position‘: ‘absolute‘,
        ‘top‘: ‘50%‘,
        ‘left‘: ‘50%‘,
        ‘font-size‘: ‘25px‘,
        ‘padding‘: ‘50px 100px‘,
        ‘border-radius‘: ‘5px‘,
        ‘background-color‘: ‘#fff‘,
        ‘color‘: ‘#000‘
    });
    $div.append($contentDiv);
    $(‘body‘).append($div);

    // 获取创建的大小
    var newW = (parseInt($contentDiv.css(‘width‘)) + 200) / 2;
    var newH = (parseInt($contentDiv.css(‘height‘)) + 100) / 2;
    $contentDiv.css({
        ‘margin-top‘: -newH + ‘px‘,
        ‘margin-left‘: -newW + ‘px‘,
    })
    setTimeout(function() {
        $div.remove();
        if (fn) {
            fn(); //回调函数    
        }

    }, time);
}

 

js 弹窗并定时关闭

原文:https://www.cnblogs.com/jiangfeilong/p/11135190.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!