jquery toast插件

所属分类： JQ特效 UI 工具提示

查看演示立即下载

插件描述：Toaster.js是一款Material Design风格jquery toast插件。Toaster.js提供5种主题，以及众多配置参数，用于显示toast类型的消息提示框。

Toaster.js

Toaster.js是一款Material Design风格jquery toast插件。Toaster.js提供5种主题，以及众多配置参数，用于显示toast类型的消息提示框。

Toaster.js的特点有：

提供5种主题风格。
可以设置Toast自动消失。
可以显示关闭按钮。
可以显示关闭进度条。
支持从右向左显示。

使用方法

在页面中引入toast.style.css，jquery和toast.script.js文件。

<link href="css/toast.style.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/toast.script.js"></script>

初始化插件

$.Toast()对象需要接收4个参数，分别为：标题、消息、类型和参数。
$.Toast(title, message, type, options);    
title：Toast的标题。
message：Toast的消息体。
type：Toast的类型。
options：配置参数。

默认的配置参数如下：

{
    // append to body
    appendTo: "body",
    // is stackable?
    stack: false,
    // 'toast-top-left'
    // 'toast-top-right'
    // 'toast-top-center'
    // 'toast-bottom-left'
    // 'toast-bottom-right'
    // 'toast-bottom-center'
    position_class: "toast-bottom-right",
    // true = snackbar
    fullscreen: false,
    // width
    width: 250,
    // space between toasts
    spacing: 20,
    // in milliseconds
    timeout: 4000,
    // has close button
    has_close_btn: true,
    // has icon
    has_icon: true,
    // is sticky
    sticky: false,
    // border radius in pixels
    border_radius: 6,
    // has progress bar
    has_progress: false,
    // RTL support
    rtl: false
}

特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com

上一个特效： jQuery分页插件
下一个特效： JavriptDesktop