> php教程 > php手册 > 很漂亮的提示框插件,代码也简洁(jNotify插件)

很漂亮的提示框插件,代码也简洁(jNotify插件)

WBOY
풀어 주다: 2016-06-07 11:38:53
원래의
1333명이 탐색했습니다.

jNotify是一款基于jQuery的信息提示插件,它支持操作成功、操作失败和操作提醒三种信息提示方式。
很漂亮的提示框插件,代码也简洁(jNotify插件)

页面底部有演示、免费下载链接。若是想看更多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元

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 추천
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿