基于jQuery实现带动画效果超炫酷的弹出对话框(附源码下载)
更新时间:2016年02月22日 14:26:55 作者:爱上程序猿
这是一款基于jQuery的弹出对话框插件,这个jQuery对话框插件的最大特点是弹出和关闭都带有非常炫酷的动画特效,需要的朋友参考下吧
这是一款基于jQuery的弹出对话框插件,这个jQuery对话框插件的最大特点是弹出和关闭都带有非常炫酷的动画特效,比如旋转飞入、上下抖动飞入等。效果图如下:
html代码:
<div class="container"> <h1>jQuery gDialog Plugin Exampels</h1> <button class="btn demo-1">Alert Dialog Box</button> <button class="btn demo-2">Prompt Dialog Box</button> <button class="btn demo-3">Prompt Dialog Box</button> </div> <script src="src/jquery.js"></script> <script src="src/jquery.gDialog.js"></script> <script> $('.demo-1').click(function(){ $.gDialog.alert("Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse libero erat, scelerisque sit amet dolor nec, euismod feugiat massa.", { title: "Alert Dialog Box", animateIn: "bounceIn", animateOut: "bounceOut" }); }); $('.demo-2').click(function(){ $.gDialog.prompt("脚本之家", www.jb51.net, { title: "Prompt Dialog Box", required: true, animateIn : "rollIn", animateOut: "rollOut" }); }); $('.demo-3').click(function(){ $.gDialog.confirm("Are You Sure?", { title: "Confirm Dialog Box", animateIn : "bounceInDown", animateOut: "bounceOutUp" }); }); </script>
以上所述是小编给大家介绍的基于jQuery实现带动画效果超炫酷的弹出对话框(附源码下载),希望对大家有所帮助!
您可能感兴趣的文章:
- jQuery代码实现对话框右上角菜单带关闭×
- jQuery实现时尚漂亮的弹出式对话框实例
- jquery插件hiAlert实现网页对话框美化
- JQuery弹出炫丽对话框的同时让背景变灰色
- jQuery实现单击按钮遮罩弹出对话框(仿天猫的删除对话框)
- Jquery EasyUI中弹出确认对话框以及加载效果示例代码
- jquery删除提示框弹出是否删除对话框
- jQuery Mobile的loading对话框显示/隐藏方法分享
- JQuery制作的放大效果的popup对话框(未添加任何jquery plugin)分享
- Jquery实现页面加载时弹出对话框代码
- 6款经典实用的jQuery小插件及源码(对话框/提示工具等等)
- jQuery Dialog对话框事件用法实例分析
- jquery实现点击弹出可放大居中及关闭的对话框(附demo源码下载)
最新评论