最近做系统,想到使用后台要使用消息提醒,但是一直苦恼消息提醒的效果,于是找了一个toastmessage,还不错。记录下使用的方法。

第一步:引入需要的文件

<script type="text/javascript" src="/js/admin/toastmessage/jquery.toastmessage.js"></script>
<link href="/js/admin/toastmessage/css/jquery.toastmessage.css" type="text/css" rel="stylesheet" />

第二步:测试使用的函数

<script>
function showSuccessToast() {
$().toastmessage('showSuccessToast', "Success Dialog which is fading away ...");
}
function showStickySuccessToast() {
$().toastmessage('showToast', {
text : 'Success Dialog which is sticky',
sticky : true,
position : 'top-right',
type : 'success',
closeText: '',
close : function () {
console.log("toast is closed ...");
}
}); }
function showNoticeToast() {
$().toastmessage('showNoticeToast', "Notice Dialog which is fading away ...");
}
function showStickyNoticeToast() {
$().toastmessage('showToast', {
text : 'Notice Dialog which is sticky',
sticky : true,
position : 'top-right',
type : 'notice',
closeText: '',
close : function () {console.log("toast is closed ...");}
});
}
function showWarningToast() {
$().toastmessage('showWarningToast', "Warning Dialog which is fading away ...");
}
function showStickyWarningToast() {
$().toastmessage('showToast', {
text : 'Warning Dialog which is sticky',
sticky : true,
position : 'top-right',
type : 'warning',
closeText: '',
close : function () {
console.log("toast is closed ...");
}
});
}
function showErrorToast() {
$().toastmessage('showErrorToast', "Error Dialog which is fading away ...");
}
function showStickyErrorToast() {
$().toastmessage('showToast', {
text : 'Error Dialog which is sticky',
sticky : true,
position : 'top-right',
type : 'error',
closeText: '',
close : function () {
console.log("toast is closed ...");
}
});
}
</script>

实例网站:

http://akquinet.github.io/jquery-toastmessage-plugin/demo/demo.html

This entry was posted in Javascript and tagged javascript toastmessage 消息提醒

jquery 消息提醒插件 toastmessage的更多相关文章

  1. Jquery消息提示插件toastr使用详解

    toastr是一个基于jQuery简单.漂亮的消息提示插件,使用简单.方便,可以根据设置的超时时间自动消失. 1.使用很简单,首选引入toastr的js.css文件 html <script s ...

  2. Jquery消息提示插件toastr使用

    toastr是一个基于jQuery简单.漂亮的消息提示插件,使用简单.方便,可以根据设置的超时时间自动消失. 相关文件到官网去下载即可 1.引入toastr的js和css文件 <link hre ...

  3. Jquery消息提示插件toastr

    toastr是一个基于jQuery简单.漂亮的消息提示插件,使用简单.方便,可以根据设置的超时时间自动消失. 1.使用很简单,首选引入toastr的js.css文件 <script src=&q ...

  4. 介绍Web项目中用到的几款JQuery消息提示插件

    第一款 noty 官方网站:https://github.com/needim/noty 第二款 artDialog artDialog是一个精巧的web对话框组件,压缩后只有十多KB,并且不依赖其他 ...

  5. jQuery Growl插件(消息提醒)

    ps:菜鸟教程 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <s ...

  6. jQuery Growl 插件(消息提醒)

    jQuery Growl 插件(消息提醒) 允许您很容易地在一个覆盖层显示反馈消息.消息会在一段时间后自动消失,不需要单击"确定"按钮等.用户也可以通过移动鼠标或点击关闭按钮加快隐 ...

  7. jQuery 消息提示/通知插件

    常见消息提醒,类似于Chrome notification,易于使用,用户体验赞. // Simple $.sticky('hi, every body rock!'); // Advantage $ ...

  8. 基于jQuery消息提示框插件Tipso

    今天要分享的这款jQuery消息提示框插件名叫Tipso,它的特点是可以定义提示框的显示位置,以及动态改变提示框的提示内容,应该说是一款相当灵活的jQuery消息提示框插件.效果图如下: 在线预览   ...

  9. 强大的响应式jQuery消息通知框和信息提示框插件

    lobibox是一款功能很强大的jQuery消息通知框和信息提示框插件.这个插件分为两个部分:消息通知框和信息提示框.它能很好的结合Bootstrap使用. 信息提示框 lobibox的信息提示框能够 ...

随机推荐

  1. Log4j等级测试

    一.结论: 1./**debug.info.warn.error.fatal由低到高*/ 2.注意:log.error(message,e)不会打印异常堆栈信息. 二.测试过程 1.代码 packag ...

  2. OC基础(25)

    NSNumber NSValue NSDate NSFileManager *:first-child { margin-top: 0 !important; } body > *:last-c ...

  3. DFS与BFS

    顾名思义,DFS就是一直在一个方向搜索,当这一方向不可以时退回该点,换下一方向: 而BFS一开始就是向四面八方搜索,把符合条件的点存入队列中,当前一个点都搜索完毕时,再从队列顶中取出点,再向四面八方搜 ...

  4. jenkins系列1--自动打tag

    点击标题下「蓝色微信名」可快速关注 坚持的是分享,搬运的是知识,图的是大家的进步,没有收费的培训,没有虚度的吹水,喜欢就关注.转发(免费帮助更多伙伴)等来交流,想了解的知识请留言,给你带来更多价值,是 ...

  5. 将你的代码上传 Bintray 仓库

    在 Android Studio 中,我们通常可以利用 gradle 来导入别人写的第三方库,通常可以简单得使用一句话就能搞定整个导包过程, 比如: compile 'net.cpacm.moneyt ...

  6. Web 站点的水平扩展和垂直扩展 (译文)

    当一个开发人员提升计算机系统负荷时,通常会考虑两种方式垂直扩展和水平扩展.选 用哪种策略主要依赖于要解决的问题以及系统资源的限制.在这篇文章中我们将讲述这两种策略并讨论每种策越的优缺点.如果你已经有一 ...

  7. python中若干错误

    今天在运行的django的时候一直提示”系统错误“,如下 except Exception, ex: logger.error(printException()) return render_stri ...

  8. Accessing the Deep Web: A Survey

    http://www.inf.ufsc.br/~ronaldo/deepWeb/querying/Chang-dwsurvey-cacm07.pdf

  9. MySQL学习笔记(二)

    二.SQL基本知识 SQL 是一种典型的非过程化程序设计语言,这种语言的特点是:只指定哪些数据被操纵,至于对这些数据要执行哪些操作,以及这些操作是如何执行的,则未被指定.非过程化程序设计语言的优点在于 ...

  10. linux下的tomcat自动退出的问题

    1,环境:mysql+tomcat+linux 2,发现问题:连接池断开连接 No operations allowed after connection closed 连接池断开了,再进行连接就报错 ...