jNotify是一款基于jQuery的信息提示插件,它支持操作成功、操作失败和操作提醒三种信息提示方式。
页面底部有演示、免费下载链接。若是想看更多js特效、网站源码、 js教程请访问【素材火】 http://www.sucaihuo.com/js 还有演示DEMO,最主要是可以免费下载。1、<br>
首先引入jQuery库和jNotify插件:<br>
<script></script> <br>
<script></script> <br>
<link>
<br>
2、<br>
本文展示了4个DEMO,HTML排版如下:<br>
<p><a>1、操作成功!</a></p> <br>
<p><a>2、操作提醒!</a></p> <br>
<p><a>3、操作失败!</a></p>
<br> <br>
<p><a>4、操作成功,提醒和失败!!</a></p>
<br>
3、<br>
调用jNotify非常简单,代码如下:<br>
$(function() { <br>
$("a.success").click(function() { <br>
jSuccess("恭喜,操作成功! + <strong>10</strong> 金币!", { <br>
VerticalPosition: 'center', <br>
HorizontalPosition: 'center' <br>
}); <br>
}); <br>
$("a.notice").click(function() { <br>
jNotify("注意:请完善你的<strong>个人资料!</strong>"); <br>
}); <br>
$("a.error").click(function() { <br>
jError("操作失败,请重试!!"); <br>
}); <br>
$("a.three").click(function() { <br>
jSuccess("操作成功,2秒后显示下一个提示框!!", { <br>
TimeShown: 2000, <br>
onClosed: function() { <br>
jNotify("注意:点击这里显示下一个提示框", { <br>
VerticalPosition: 'top', <br>
autoHide: false, <br>
onClosed: function() { <br>
jError("出错啦! 演示结束,<br> 请点击背景层关闭提示框。", { <br>
clickOverlay: true, <br>
autoHide: false, <br>
HorizontalPosition: 'left' <br>
}); <br>
} <br>
}); <br>
} <br>
}); <br>
}); <br>
});
查看该特效演示及免费下载,请访问【素材火】: http://www.sucaihuo.com/js/61.html
AD:真正免费,域名+虚机+企业邮箱=0元