bootstrap4和jQuery消息通知插件
源码介绍
这是一款基于bootstrap4的jQuery消息通知插件。该消息通知插件使用简单,可生成多种主题的toast消息通知,可设置为自动消失或固定时间消失等,非常实用。
在页面中引入jquery和bootstrap4相关文件,以及notifyMessage相关文件。 该jQuery消息通知插件最基本的使用方法如下: 可以指定消息框在多少秒钟之后消失。 也可以使消息框固定在屏幕上,手动点击关闭按钮才消失。 可以定义消息的主题颜色。 还可以通过点击“查看更多”链接打开模态对话框。 该jQuery消息通知插件的github地址为:https://github.com/silentgrave/notifyMessage简要教程
使用方法
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" media="screen" href="css/notifyMessage.css" />
<script src="js/notifyMessage.js"></script>
初始化插件
runNotify({
message: '这是一则消息通知',
messageTitle: '标题'
});
runNotify({
message: '这是一则消息通知',
messageTitle: '标题',
timer: '5000'
});
runNotify({
message: '这是一则消息通知',
messageTitle: '标题',
type: 'fixed'
});
runNotify({
message: '这是一则成功消息通知',
messageTitle: '标题',
levelMessage: 'success'
});
runNotify({
message: '这是一则错误消息通知',
messageTitle: '标题',
levelMessage: 'error'
});
runNotify({
message: '这是一则警告消息通知',
messageTitle: '标题',
levelMessage: 'warning'
});
runNotify({
message: 'Success message text!',
levelMessage: 'success',
type: 'readmore',
messageTitle: 'Title of modal',
readMoreMessage: 'Open the notify!'
});
本站资源均来自互联网,仅供研究学习,禁止违法使用和商用,产生法律纠纷本站概不负责!如果侵犯了您的权益请与我们联系!
转载请注明出处: 免费源码网-免费的源码资源网站 » bootstrap4和jQuery消息通知插件
发表评论 取消回复