消息小插件


    function KMMessage(icon, msg,time) {
        var wrap = $('.KmMsgBox').length >0;
        if (wrap) {
            //已经存在
           
            switch (icon) {
                case 1:
                    $('.KmMsgBox .KmMsgBox-icon').css({ 'background-color': ' #52c5c5' }).html('√');
                    break;
                case 2:
                    $('.KmMsgBox .KmMsgBox-icon').css({ 'background-color': '#d4ce10' }).html('!');
                    break;
                case 3:
                    $('.KmMsgBox .KmMsgBox-icon').css({ 'background-color': '#c55252' }).html('?');
                    break;
                default:
                    $('.KmMsgBox .KmMsgBox-icon').css({ 'background-color': '#fff' }).html('√');
                    break;
            }
            $('.KmMsgBox .KmMsgBox-word').html(msg);
            $('.KmMsgBox').slideDown("slow");
        } else {
             //不存在
            var dom = ' <div class="KmMsgBox" style=" background-color: #fff; border-radius: 3px; height: 60px;  position: absolute; top: 20px;left: 50%; text-align: center;line-height: 60px;padding:0 20px;display:none">';
            switch (icon) {
                case 1:
                    dom += '<span class="KmMsgBox-icon" style="display: inline-block;vertical-align: middle;text-align: center;line-height: 27px;font-size: 20px;width: 26px;height: 26px;border-radius: 50%;color: #fff;background-color: #52c5c5;">√</span>';
                    break;
                case 2:
                    dom += '<span class="KmMsgBox-icon" style="display: inline-block;vertical-align: middle;text-align: center;line-height: 27px;font-size: 20px;width: 26px;height: 26px;border-radius: 50%;color: #fff;background-color: #d4ce10;">!</span>';
                    break;
                case 3:
                    dom += '<span class="KmMsgBox-icon" style="display: inline-block;vertical-align: middle;text-align: center;line-height: 27px; font-size: 20px;width: 26px;height: 26px;border-radius: 50%;color: #fff;background-color: #c55252;" >?</span>';
                    break;
                default:
                    dom += '<span class="KmMsgBox-icon" style="display: inline-block;vertical-align: middle;text-align: center;line-height: 27px;font-size: 20px;width: 26px;height: 26px;border-radius: 50%;color: #fff;background-color: #52c5c5;">√</span>';
                    break;
            }
            dom += '<span class="KmMsgBox-word" style="vertical-align:middle;font-size:18px;color:#000;font-weight: bold;margin-left: 6px"> ' + msg+' </span>';
            dom += '</div >';
            var jQObj = $(dom).appendTo('body');
            $('.KmMsgBox').slideDown("slow");
            $('.KmMsgBox').css({ 'margin-left': '-' + jQObj.width() / 2 + 'px' })
        }
        window.setTimeout(function () {
            $('.KmMsgBox').slideUp("slow");
        }, time || 2000)
    }

效果:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值