信息窗口提示

Html

Css

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

↑上面代码改变，会自动显示代码结果 jQuery调用版本：1.11.3

立即下载

信息窗口提示



代码描述：常用的遮罩层信息弹窗

prompt(newname,time,fn) ===》
newname 需要提示的内容
time 遮罩层出现，几秒关闭
fn 回调函数可写可不写！

0

最新

发表评论全部评论

暂时没有评论！

登录后才可以评论

30秒后在评论吧!

PROMULGATOR

你头发乱了

相关代码

信息窗口提示

最新