一款jQuery通知插件Noty
最后更新于:十月 14, 2017

一款jQuery通知插件Noty

今天闲来无事,于是就给登录页面、注册页面、密码修改页面改了个版,在处理用户交互时,联想到了之前在bootstarp中看见的通知效果,于是就给整合进来了。Noty  GitHub地址

首先将js与css加载到自己的主题中

<!--jQuery文件-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<!--noty主文件-->
<script type="text/javascript" src="js/noty/jquery.noty.js"></script>
<!--noty提示信息位置的文件, 需要哪些位置就引入对应的脚本,这里为center,可以添加多个布局文件-->
<script type="text/javascript" src="js/noty/layouts/center.js"></script>
<!--noty主题样式文件,-->
<script type="text/javascript" src="js/noty/themes/default.js"></script>

提示样式

alert: 默认的提示样式
success: 成功
error: 错误
warning: 警告
information: 信息

支持的布局位置:

top: 顶部,长条状
topLeft/topCenter/topRight: 顶部的左/中/右位置, 短条状
center/centerLeft/centerRight: 正中/中左/中右, 短条状
bottomLeft/bottomCenter/bottomRight: 底部左/中/右位置, 短条状
bottom: 底部,长条状

调用:

new Noty({
    text: (data.message),
    type: 'warning',
    layout: 'topLeft',
    timeout: 5000
}).show();

noty有很多扩展选项,如果想使用此款插件的童鞋,可以自己去研究下。

×