模仿APP里的toast提示弹窗

原创 Angelialee 随笔 随笔 295阅读 2017-05-16 13:54:01 举报

/
提示弹窗

  • @param: msg 弹窗所要显示的文本字符串
  • @param: time 弹窗消失的时间-数字,可填可不填
  • @demo: $.alert("提示", 4000)
    */
    $.alert = function(msg, time){
    // 样式
    var _css = "'position: fixed; top: 50%; left: 50%; height: 40px; line-height: 40px; padding: 0 10px; background-color: rgba(0, 0, 0, 0.4); color: #fff; text-align: center; margin-top: -20px;'";
    //插入元素
    var _html = ("<div class='toast' style=" + _css + ">" + msg + "</div>")
    $("body").append(_html);
    // 计算marginLeft的值使元素居中
    $(".toast")[0].style.marginLeft = -Math.round(parseInt(window.getComputedStyle($(".toast")[0]).width) / 2) + 'px';
    //控制消失的时间
    setTimeout(function() {
    $(".toast").remove();
    }, time || 2000);
    }
评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复