html toast 插件,基于Bootstrap4的Toast提示插件

这是一款基于bootstrap4的toast插件。该插件能非常方便的生成toast提示效果，不需要编写额外的html代码，非常实用。

使用方法

在页面中引入下面的文件。

初始化插件

通过下面的方法来创建一个toast效果。

$.toast({

title: 'Notice!',

subtitle: '11 mins ago',

content: 'This is a toast message.',

type: 'info',

delay: 3000,

img: {

src: 'image.png',

class: 'rounded',

title: 'Thumbnail Title',

alt: 'Alternative'

pause_on_hover: false

});

配置参数

可用的配置参数有：

title：标题。

subtitle：子标题。

content：toast的内容。

type：情景类型：'info', 'success', 'warning', 'error'。

delay：多少时间后自动消失。

img：如果要显示图片，该属性指定图片的信息。

pause_on_hover：是否在鼠标悬停时让toast不消失。

html toast 插件,基于Bootstrap4的Toast提示插件相关推荐

html5自动提示插件,jquery万能浮动框提示插件
特效描述:jquery 万能浮动框提示.jquery万能浮动框提示插件代码结构 1. 引入CSS 2. 引入JS 3. HTML代码 jQuery万能浮动框插件测试一.加载页面上元素默认rel加 ...
php 智能输入提示插件,phph 输入邮箱时自动提示邮箱后缀实现代码
1.在html中输入邮箱的input要有自己的class,以及自己父元素的class.例如: // 初始化 $(function() { new EmailAutoComplete({ parentC ...
react.js fetch 基于单例+轻提示（toast）的简单封装
Services /* eslint-disable no-useless-constructor */import config from './config.js';import 'whatwg- ...
Android 自定义带图标Toast，工具方法，Toast自定义显示时间
带图标Toast工具方法1 样式 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:an ...
一款轻量级的消息提示插件 —— toastr
toastr是一款轻量级的消息提示插件,基于JQuery,使用简单方便,外观大气漂亮. 点击这里进入toastr在线调试使用点击这里进入toastr官方网站使用效果如下图所示: 插件使用需要引用的 ...
Jquery消息提示插件toastr使用详解
toastr是一个基于jQuery简单.漂亮的消息提示插件,使用简单.方便,可以根据设置的超时时间自动消失. 1.使用很简单,首选引入toastr的js.css文件 html <script ...
SpringCloud工作笔记059---Jquery消息提示插件toastr使用详解
JAVA技术交流QQ群:170933152 toastr是一个基于jQuery简单.漂亮的消息提示插件,使用简单.方便,可以根据设置的超时时间自动消失. 1.使用很简单,首选引入toastr的js.c ...
jQuery html5Validate基于HTML5表单验证插件
更新于2016-02-25 前面提到的新版目前线上已经可以访问: http://mp.gtimg.cn/old_mp/assets/js/common/ui/Validate.js demo体验狠狠地 ...
go token验证_GitHub - goflyfox/gtoken: 基于gf框架的token插件，通过服务端验证方式实现token认证；...
gtoken 介绍基于GoFrame框架的token插件,通过服务端验证方式实现token认证:已完全可以支撑线上token认证,通过Redis支持集群模式:使用简单,大家可以放心使用: gtoke ...

html toast 插件,基于Bootstrap4的Toast提示插件

html toast 插件,基于Bootstrap4的Toast提示插件相关推荐

最新文章

热门文章