toastr是一个基于jQuery简单、漂亮的消息提示插件,使用简单、方便,可以根据设置的超时时间自动消失。

相关文件到官网去下载即可

1、引入toastr的js和css文件

 <link href="/toastr/build/toastr.css" rel="stylesheet">
<script src="/toastr/build/toastr.min.js"></script>

2、初始化toastr(此处是自定义)

toastr.options = {
closeButton: false, //是否显示关闭按钮(提示框右上角关闭按钮)
debug: false, //是否为调试;
progressBar: true, //是否显示进度条(设置关闭的超时时间进度条)
positionClass: "toast-bottom-center", //消息框在页面显示的位置
onclick: null, //点击消息框自定义事件
showDuration: "300", //显示动作时间
hideDuration: "1000", //隐藏动作时间
timeOut: "2000", //自动关闭超时时间
extendedTimeOut: "1000",
showEasing: "swing",
hideEasing: "linear",
showMethod: "fadeIn", //显示的方式
hideMethod: "fadeOut" //隐藏的方式
};
//常规消息提示,默认背景为浅蓝色
toastr.info("你有新消息了!");
//成功消息提示,默认背景为浅绿色
toastr.success("你有新消息了!");
//警告消息提示,默认背景为橘黄色
toastr.warning("你有新消息了!");
//错误消息提示,默认背景为浅红色
toastr.error("你有新消息了!");
//带标题的消息框
toastr.success("你有新消息了!","消息提示");
//另一种调用方法
toastr["info"]("你有新消息了!","消息提示");

Jquery消息提示插件toastr使用的更多相关文章

  1. Jquery消息提示插件toastr使用详解

    toastr是一个基于jQuery简单.漂亮的消息提示插件,使用简单.方便,可以根据设置的超时时间自动消失. 1.使用很简单,首选引入toastr的js.css文件 html <script s ...

  2. Jquery消息提示插件toastr

    toastr是一个基于jQuery简单.漂亮的消息提示插件,使用简单.方便,可以根据设置的超时时间自动消失. 1.使用很简单,首选引入toastr的js.css文件 <script src=&q ...

  3. 漂亮灵活设置的jquery通知提示插件toastr

    toastr是一款非常棒的基于jquery库的非阻塞通知提示插件,toastr可设定四种通知模式:成功,出错,警告,提示,而提示窗口的位置,动画效果都可以通过能数来设置,在官方站可以通过勾选参数来生成 ...

  4. 消息提示插件toastr.js与Messenger组件

    Toastr是一款基于jQuery的通知插件,可以灵活的自定义样式和拓展其功能! toastr是一个基于Jquery简单.漂亮的消息提示插件,使用简单.方便,可以根据设置的超时时间自动消失. cdn最 ...

  5. 介绍Web项目中用到的几款JQuery消息提示插件

    第一款 noty 官方网站:https://github.com/needim/noty 第二款 artDialog artDialog是一个精巧的web对话框组件,压缩后只有十多KB,并且不依赖其他 ...

  6. 基于jQuery消息提示框插件Tipso

    今天要分享的这款jQuery消息提示框插件名叫Tipso,它的特点是可以定义提示框的显示位置,以及动态改变提示框的提示内容,应该说是一款相当灵活的jQuery消息提示框插件.效果图如下: 在线预览   ...

  7. 【源码解读】js原生消息提示插件

    效果如下: 关闭message后前后message的衔接非常丝滑,这部分是我比较感兴趣的.带着这个问题先了解下DOM结构,顺便整理下作者的思路. 从DOM里我们可以看到所有的message都在一个容器 ...

  8. 基于jquery的消息提示框toastr.js

    //消息提示全局配置 toastr.options = { "closeButton": false,//是否配置关闭按钮 "debug": false,//是 ...

  9. PNotify – 简单易用的 JS 通知,消息提示插件

    PNotify 是一个 JavaScript 通知插件,前身为 Pines Notify.它旨在提供无与伦比的灵活性,同时很容易使用.它可以提供无阻塞的通知,允许用户无需关闭通知或者提示信息就可以点击 ...

随机推荐

  1. Hadoop中ssh+IP、ssh+别名免秘钥登录配置

    1.为什么要进行 SSH 无密码验证配置? Hadoop运行过程中需要管理远端Hadoop守护进程,在Hadoop启动以后,NameNode是通过SSH(Secure Shell)来启动和停止各个Da ...

  2. Scala--映射和元组

    一.构造映射 val scores = Map("Jim"->10, ("Tom",20), "Sam"->44) //key- ...

  3. ABAP error:CONVT_NO_NUMBER

    今天写了个接口,传入数据到SAP,结果接收后在报表展示时直接报错. 检查后发现数据转换出错,接收到的数据格式混乱. 最后检查了所有地方发现,源系统传入的数据长度为9个字节,但是自己的接收程序,定义数据 ...

  4. 20155216 Exp7 网络欺诈技术防范

    Exp7 网络欺诈技术防范 基础问题回答 1.通常在什么场景下容易受到DNS spoof攻击? 1.在同一局域网下比较容易受到DNS spoof攻击,攻击者可以冒充域名服务器,来发送伪造的数据包,从而 ...

  5. 20155304《网络对抗》Exp4 恶意代码分析

    20155304<网络对抗>Exp4 恶意代码分析 实践内容 1.系统运行监控 1.1使用schtasks指令监控系统运行 我们在C盘根目录下建立一个netstatlog.bat的文本文件 ...

  6. 20155317王新玮《网络对抗技术》实验9 web安全基础实践

    20155317王新玮<网络对抗技术>实验9 web安全基础实践 一.实验准备 1.0 实验目标和内容 Web前端HTML.能正常安装.启停Apache.理解HTML,理解表单,理解GET ...

  7. 字典学习(Dictionary Learning, KSVD)详解

    注:字典学习也是一种数据降维的方法,这里我用到SVD的知识,对SVD不太理解的地方,可以看看这篇博客:<SVD(奇异值分解)小结 >. 1.字典学习思想 字典学习的思想应该源来实际生活中的 ...

  8. Aspose.Cells.dll的用法

    public void OutExcel() { #region WorkbookDesigner designer = new WorkbookDesigner(); Worksheet sheet ...

  9. python 回溯法 子集树模板 系列 —— 10、m着色问题

    问题 图的m-着色判定问题 给定无向连通图G和m种不同的颜色.用这些颜色为图G的各顶点着色,每个顶点着一种颜色,是否有一种着色法使G中任意相邻的2个顶点着不同颜色? 图的m-着色优化问题 若一个图最少 ...

  10. 初识TPOT:一个基于Python的自动化机器学习开发工具

    1. TPOT介绍 一般来讲,创建一个机器学习模型需要经历以下几步: 数据预处理 特征工程 模型选择 超参数调整 模型保存 本文介绍一个基于遗传算法的快速模型选择及调参的方法,TPOT:一种基于Pyt ...