Jquery消息提示插件toastr的使用

toastr是一个基于Jquery简单、漂亮的消息提示插件。

YII2.0+默认自带Jquery消息提示插件toastr
单独引用模式:当前view视图中,引用如下:


参考:https://blog.csdn.net/netuser1937/article/details/100256539

使用说明:

//常规消息提示,默认背景为浅蓝色  
toastr.info("常规消息!");  
//成功消息提示,默认背景为浅绿色 
toastr.success("成功消息!");  
//警告消息提示,默认背景为橘黄色 
toastr.warning("警告消息!");  
//错误消息提示,默认背景为浅红色 
toastr.error("错误消息!");  

//带标题的消息框
toastr.success("成功消息!","成功消息提示");
toastr["info"]("常规消息!","常规消息提示");
toastr["warning"]("警告消息!","警告消息提示");
toastr["error"]("错误消息!","错误消息提示");

全局配置:

    toastr.options = {
        "closeButton": true,
        "debug": true,
        "progressBar": false,
        "positionClass": "toast-top-right",
        "showDuration": "400",
        "hideDuration": "1000",
        "timeOut": "3000",
        "extendedTimeOut": "1000",
        "showEasing": "swing",
        "hideEasing": "linear",
        "showMethod": "fadeIn",
        "hideMethod": "fadeOut"
    };
参数名称 说明 可选项
closeButton 是否显示关闭按钮 true,false
debug 是否使用debug模式 true,false
progressBar 是否显示进度条(设置关闭的超时时间进度条) true,false
positionClass 弹出窗的位置  
showDuration 显示的动画时间  
hideDuration 消失的动画时间  
timeOut 展现时间  
extendedTimeOut 加长展示时间  
showEasing 显示时的动画缓冲方式 swing
hideEasing 消失时的动画缓冲方式 linear
showMethod 显示时的动画方式 fadeIn
hideMethod 消失时的动画方式 fadeOut
positionClass
toast-top-left 顶端左边
toast-top-right  顶端右边
toast-top-center 顶端中间
toast-top-full-width 顶端中间(宽度铺满)
toast-bottom-right  底部右边
toast-bottom-left  底部左边
toast-bottom-center  底部中间
toast-bottom-full-width 底部中间(宽度铺满)

你可能感兴趣的:(WEB前端)