messageLite优雅的消息提示弹框

所属分类:UI-对话框,工具提示

 14389  225  查看评论 (8)
分享到微信朋友圈
X
messageLite优雅的消息提示弹框 ie兼容10

参数详解:

message:' 操作成功',    //提示信息
duration:'5000',       //显示时间(默认:5s)
type:'info',           //显示类型,包括4种:success.error,info,warning 默认info
showClose:false,       //显示关闭按钮(默认:否)
center:true,           //页面竖直居中(默认:否)
onClose:function,      //点击关闭回调函数

调用方式:

$('.btn-info').on('click',function(){
   $.message({
       message:'信息提醒',
       type:'info'
   });
})
$('.btn-success').on('click',function(){
   $.message({
       message:'成功提示',
       type:'success'
   });
})
$('.btn-warning').on('click',function(){
   $.message({
       message:'警告提示',
       type:'warning',
duration:0,
showClose:true,
center:true,
onClose:function(){alert('知道了')}
   });
})
$('.btn-danger').on('click',function(){
   $.message({
       message:'失败提示',
       type:'error'
   });
})
相关插件-对话框,工具提示

讨论这个项目(8)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    白色 1
    2020/9/1 15:45:45

    加上鼠标悬停清空定时器 移走打开定时器 这样就跟vue-element 的message一样了我们需求也这样,所以稍微改一下

    if (options.duration != 0) {
        var timer;
        timed();
    
        function timed() {
            timer = setTimeout(function() {
                !isIE() ? (ele && ele.remove()) : (ele && ele.removeNode());
            }, options.duration || 5000)
        }
        $('.toast-message').hover(function() {
            clearTimeout(timer)
        }, function() {
            timed();
        });
    
    }
    回复
    L's 1
    2020/4/10 10:57:54
    133行应当加上 options.onClose() 回复
    ? Fairy 0
    2020/4/7 11:37:55
    ざ醉梦初醒 0
    2019/8/22 9:44:21
    llsApple 0
    2019/8/16 10:33:02
    枫之博 0
    2019/8/9 16:46:04
    特别好 0
    2019/6/11 11:09:05
    夙风 0
    2019/6/4 10:10:01
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复