在线实例

实例演示

使用方法

  1. <button type="button" class="btn btn-primary" id="showtoast">显示</button>
复制
  1. toastr.info('我只是一个提示信息')
复制

参数说明

  1. $(function(){
  2. //参数设置,若用默认值可以省略以下面代
  3. toastr.options = {
  4. "closeButton": false, //是否显示关闭按钮
  5. "debug": false, //是否使用debug模式
  6. "positionClass": "toast-top-full-width",//弹出窗的位置
  7. "showDuration": "300",//显示的动画时间
  8. "hideDuration": "1000",//消失的动画时间
  9. "timeOut": "5000", //展现时间
  10. "extendedTimeOut": "1000",//加长展示时间
  11. "showEasing": "swing",//显示时的动画缓冲方式
  12. "hideEasing": "linear",//消失时的动画缓冲方式
  13. "showMethod": "fadeIn",//显示时的动画方式
  14. "hideMethod": "fadeOut" //消失时的动画方式
  15. };
  16. //成功提示绑定
  17. $("#success").click(function(){
  18. toastr.success("祝贺你成功了");
  19. })
  20. //信息提示绑定
  21. $("#info").click(function(){
  22. toastr.info("这是一个提示信息");
  23. })
  24. //敬告提示绑定
  25. $("#warning").click(function(){
  26. toastr.warning("警告你别来烦我了");
  27. })
  28. //错语提示绑定
  29. $("#error").click(function(){
  30. toastr.error("出现错误,请更改");
  31. })
  32. //清除窗口绑定
  33. $("#clear").click(function(){
  34. toastr.clear();
  35. })
  36. })
复制

toastr 自定义提示的更多相关文章

  1. toastr 通知提示插件

    table.sb-tb td,table.sb-tb th { padding: 5px 10px !important } jquery toastr 一款轻量级的通知提示框插件. 网页开发中经常会 ...

  2. 超酷HTML5 Canvas图表应用Chart.js自定义提示折线图

    超酷HTML5 Canvas图表应用Chart.js自定义提示折线图 效果预览 实例代码 <div class="htmleaf-container"> <div ...

  3. VaildForm 自定义提示消息

    ValidForm插件提供了7种提示效果,其中有四种自定义效果,具体访问地址:http://validform.rjboy.cn/demo.html 个人偏爱其中两种,即 l 提示效果四:[自定义提示 ...

  4. 在ASP.NET中引用自定义提示框

    在html网页中自定义提示框 正文: 在一般的B/S架构中项目,与用户的交互信息是非常重要的.在一般的情况下,设计人员都在把用户信息呈现在html中,用div和span去弹出相关信息.对于一般的情况而 ...

  5. ACE.js自定义提示实现方法

    ACE.js自定义提示实现方法 时间 2015-11-19 00:55:22  wsztrush's blog 原文  http://wsztrush.github.io/编程技术/2015/11/0 ...

  6. 写了一个迷你toast提示插件,支持自定义提示文字和显示时间

    写了一个迷你toast提示插件,支持自定义提示文字和显示时间,不想用其他第三方的ui插件,又想要toast等小效果来完善交互的同学可以试试, 代码中还贡献了一段css能力检测js工具函数,做项目的时候 ...

  7. vue2.0 自定义 提示框(Toast)组件

    1.自定义 提示框 组件 src / components / Toast / index.js /** * 自定义 提示框( Toast )组件 */ var Toast = {}; var sho ...

  8. 安卓socket 心跳和信鸽自定义提示音

    /** * 连接socket 和心跳 */ public class SocketService extends Service { private static addNewOrderInterfa ...

  9. springboot之additional-spring-configuration-metadata.json自定义提示

    springboot之additional-spring-configuration-metadata.json自定义提示 简介 additional-spring-configuration-met ...

随机推荐

  1. javascript中可变值与不可变值(原始值)

    字符串原始值修改不了1 var str = "abc"; 2 str[0] = "d"; 3 console.log(str[1]="f") ...

  2. IE和firefox火狐在JS、css兼容区别

    1.firefox不能对innerText支持. firefox支持innerHTML但却不支持innerText,它支持textContent来实现innerText,不过默认把多余的空格也保留了. ...

  3. Hadoop官方文档翻译——YARN Architecture(2.7.3)

    The fundamental idea of YARN is to split up the functionalities of resource management and job sched ...

  4. Azure ARM (4) 开始创建ARM Resource Group并创建存储账户

    <Windows Azure Platform 系列文章目录> 好了,接下来我们开始创建Azure Resource Group. 1.我们先登录Azure New Portal,地址是: ...

  5. JVM Tomcat性能实战

    本节只是介绍实战部分,具体的理论参数,请自行百度. 所需工具:linux服务器  Jmeter测试工具  xshell   一个web应用 Tomcat的JVM参数可以配置在catalina.sh,如 ...

  6. Auto Mapper02《demo》

         学习这些基本上网上都有一些教程或者别人做的demo,我是按照这个方式去学习的.先做个demo,学会如何去使用它,接着去慢慢的了解它是如何的运行的,理解里面的一些基本的基础知识.我们不可以再像 ...

  7. vue之watch用法

    对应一个对象,键是观察表达式,值是对应回调.值也可以是方法名,或者是对象,包含选项.在实例化时为每个键调用 $watch() ; //使用官方vue-cli脚手架书写<template> ...

  8. 【转】NoSQL初探之人人都爱Redis:(2)Redis API与常用数据类型简介

    一.Redis API For .Net 首先,不得不说Redis官方提供了众多的API开发包,但是目前Redis官方版本不支持.Net直接进行连接,需要使用一些第三方的开源类库.目前最流行的就是Se ...

  9. 【转载】CSS Sticky Footer: 完美的CSS绝对底部

    下面是我找到的一个比较完美的方法,来自国外的设计达人,纯CSS,可以实现: 当正文内容很少时,底部位于窗口最下面.当改变窗口高度时,不会出现重叠问题. <div id="wrap&qu ...

  10. 使用NVelocity生成内容的几种方式

    使用NVelocity也有几个年头了,主要是在我的代码生成工具Database2Sharp上使用来生成相关代码的,不过NVelocity是一个非常不错的模板引擎,可以用来生成文件.页面等相关处理,非常 ...