前端发开插件之toastr

首先,先附上 toast插件 的使用效果:


toastr.js是一个基于jQuery的非阻塞通知的JavaScript库。toastr.js可以设定四种通知模式:成功、出错、警告、提示。提示窗口的位置、动画效果等都可以通过参数来设置,并且可以在官方网站上通过勾选参数来生成JavaScript代码,操作简单,容易上手,推荐使用。

插件下载地址:

https://github.com/CodeSeven/toastr

http://www.toastrjs.com

使用方法介绍:

1、在官网下载插件文件

2、导入toastr的js、css文件



3、接下来就可以使用了,toastr的使用方法与alert类似
$("#info").click(function(){
 
 toastr.info("这是一个提示信息");
 
 })
同时还有

toastr.success("成功");
toastr.warning("警告");
toastr.error("错误");

 
  
也可以自己更改toastr的设置:

 toastr.options = {
  
  "closeButton": false, //是否显示关闭按钮
  
  "debug": false, //是否使用debug模式
 
 "positionClass": "toast-top-full-width",//弹出窗的位置
 
 "showDuration": "300",//显示的动画时间
 
 "hideDuration": "1000",//消失的动画时间
 
 "timeOut": "5000", //展现时间
 
 "extendedTimeOut": "1000",//加长展示时间
 
 "showEasing": "swing",//显示时的动画缓冲方式
 
 "hideEasing": "linear",//消失时的动画缓冲方式
 
 "showMethod": "fadeIn",//显示时的动画方式
 
 "hideMethod": "fadeOut" //消失时的动画方式
 
 };





你可能感兴趣的:(前端发开插件之toastr)