23个Javascript弹出窗口特效整理


Posted in Javascript onFebruary 25, 2011

1. Lightview

Lightview是一个基于Prototype与Script.aculo.us开发,用于创建可以覆盖整个页面的模式对话框。展示的内容不仅可以是图片、文字、网页、通过Ajax 调用的内容,还可以是Quicktime/Flash影片都能够以非常酷的效果展示。

2. ThickBox (演示地址)

ThickBox是一个模式对话框UI控件。基于jQuery开发,可以用来展示单张或多张图片,内嵌的内容,iframed的内容,或通过Ajax获取的内容。

3. Fonshen JS Window (演示地址)

风声JS窗口为模拟WEB弹出窗口和对话框提供一种方案。程序基于 JavaScript/XHTML/CSS 标准实现。支持自由度极高的窗口样式定制;交互方面提供模拟的按钮编程模型,可以很好的模拟对话框; 另外,接口参考Javascript内置对象window的一些方法(比如:window.open, window.alert, window.confirm),简洁方便。

4. ymPrompt

在web开发中,对于浏览器默认的消息提示框(如alert,confirm等)外观无法控制,为了实现更好的界面效果,于是模拟系统的消息提示框 实现了该组件。在外观上可以通过css进行完全的控制。调用方式简单,直接使用ymPrompt.alert()的方式调用,传入相应的参数即可。提供四 种消息类型。分别为消息提示、成功信息、错误信息、询问信息。

5. Modalbox

ModalBox用于生成Web2.0风格的模式对话框。基于Prototype script.aculo.us框架开发,效果类似Mac OSX的模式对话框。内容可以通过Ajax加载或普通的HTML页面。

6. SliderWindow

SliderWindow是一个基于YUI开发消息提醒滑动窗体。

7. MOOdalBox (演示地址)

MOOdalBox是一个基于Mootools框架开发的Web2.0模式对话。用于利用Ajax加载远程内容进行展示。

8. jqWindowsEngine

这个jQuery插件能够帮助你轻松创建Ajax Windows。

9. jQuery Alert Dialogs (演示地址)

这个jQuery插件能够替换JavaScript提供的alert()、confirm()和prompt()功能。支持利用CSS自定义对话框外观。

10. JQuery Float Dialog

JQuery Float Dialog是一个浮动模式对话框,可通过参数控制对话框弹出速度、全屏背景、弹出回调事件、弹出的方向等。

11. Facebook-Style Modal Box

利用Mootools开发的一个Facebook风格模式对话框。

12. Facebox (演示地址)

Facebox是一个采用Mootools框架实现,拥有Facebook风格的模式对话框。它可以展示images、Flash、html等内容。与另外一个用jQuery实现的Facebox相似。

13. jmpopups (演示地址)

jmpopups是一个可同时打开多个模式对话框的jQuery插件。弹出窗中的内容可以从当前页面中获取,也可以利用Ajax获取。jmpopups兼容大部分浏览器包括:IE6 、FF1.5 、Opera9.*、Chrome2.*、Safari 4.*。

14. dhtmlxWindows

dhtmlxWindows是一个JavaScript对话框Window控件。windows可以被关闭,最大化/最小化,调整大小,置顶,拖放等。

15. Custom JavaScript Dialog Boxes

一个轻量级(4.5kb左右) 自定义JavaScript模式对话框组件。

16. Control.Popup (演示地址)

弹出窗控件。

17. weebox

weebox是一个基于jquery的弹窗插件。它含有以下特性:

.支持多层弹窗

.支持单一弹窗,即同ID弹窗在打开第二次使用时,前一个将被自动关闭,参考boxid选项

.支持自定义样式,参考boxclass选项

.解决IE中SELECT的问题,使用了bgiframe功能

.支持拖动效果,通过draggable设置,参考draggable选项

.支持内容来源方式Ajax, Selector(jQuery的), Text(直接内容)

.支持多种弹窗类型,参考type选项

.支持自动关闭,参考timeout选项

.支持遮照效果(modal弹窗),参考modal选项

.支持不同的显示位置,中间或者以某个元素为参照物,参考position选项

.支持弹窗打开前(onopen)、点确认(onok)、点取消(oncancel)、关闭窗口(onclose)等的回调函数

.支持打开后,重新设置标题(setTitle)、内容(setContent)、按钮等方法

.支持只在弹窗内查找元素的方法:find(selector)

.支持打开和关闭时的动画效果,参考animate、showAnimate,hideAnimate选项

18. jQuery Impromptu

用于创建模式对话框,确认对话框,输入内容对话框的jQuery插件。

19. Boxy

Boxy是一个jQuery插件用于创建灵活,类似于facebook风格的Web2.0模式对话框。

20. DHTML window with tab support (演示地址)

带有Tab支持的DHTML Window控件。它使用cookies来

21. mooMessagebox

一个可以灵活配置,采用Mootools开发的自定义Window窗体。

22. NyroModal

一个基于jQuery开发,非常灵活和可定制外观/动画效果的模式对话框。可通过Ajax调用目标内容,改变对话框大小等。

23. SimpleModal

SimpleModal是一个轻量级jQuery插件提供了一个简单的接口来创建模式对话框。

Javascript 相关文章推荐
javascript面向对象的方式实现的弹出层效果代码
Jan 28 Javascript
js本身的局限性 别让javascript做太多事
Mar 23 Javascript
防止按钮在短时间内被多次点击的方法
Mar 10 Javascript
jQuery如何将选中的对象转化为原始的DOM对象
Jun 09 Javascript
jQuery实现气球弹出框式的侧边导航菜单效果
Sep 22 Javascript
jquery拖拽排序简单实现方法(效果增强版)
Feb 16 Javascript
JavaScript制作简单分页插件
Sep 11 Javascript
详解堆的javascript实现方法
Nov 29 Javascript
微信小程序组件 marquee实例详解
Jun 23 Javascript
javascript字体颜色控件的开发 JS实现字体控制
Nov 27 Javascript
layui点击按钮添加可编辑的一行方法
Aug 15 Javascript
全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作
Sep 08 Javascript
Easy.Ajax 部分源代码 支持文件上传功能, 兼容所有主流浏览器
Feb 24 #Javascript
dojo随手记 gird组件引用
Feb 24 #Javascript
浏览器常用高宽的jquery插件
Feb 24 #Javascript
基于jquery的横向滚动条(滑动条)
Feb 24 #Javascript
基于JQuery的日期联动实现代码
Feb 24 #Javascript
jQuery boxy弹出层插件中文演示及使用讲解
Feb 24 #Javascript
jquery的键盘事件修改代码
Feb 24 #Javascript
You might like
如何使用动态共享对象的模式来安装PHP
2006/10/09 PHP
提高PHP编程效率 引入缓存机制提升性能
2010/02/15 PHP
浅谈php自定义错误日志
2015/02/13 PHP
PHP实现一维数组转二维数组的方法
2015/02/25 PHP
基于PHP的加载类操作以及其他两种魔术方法的应用实例
2017/08/28 PHP
kindeditor 加入七牛云上传的实例讲解
2017/11/12 PHP
Laravel框架源码解析之模型Model原理与用法解析
2020/05/14 PHP
javascript语句中的CDATA标签的意义
2007/05/09 Javascript
用js 让图片在 div或dl里 居中,底部对齐
2008/01/21 Javascript
JavaScript字符串对象toLowerCase方法入门实例(用于把字母转换为小写)
2014/10/17 Javascript
浅谈Javascript 数组与字典
2015/01/29 Javascript
jQuery实现弹出带遮罩层的居中浮动窗口效果
2016/09/12 Javascript
详解Javascript百度地图接口开发文档中的类和方法
2017/02/07 Javascript
JS实现线性表的顺序表示方法示例【经典数据结构】
2017/04/11 Javascript
微信小程序实现瀑布流布局与无限加载的方法详解
2017/05/12 Javascript
微信小程序报错:this.setData is not a function的解决办法
2017/09/27 Javascript
JavaScript日期工具类DateUtils定义与用法示例
2018/09/03 Javascript
JS使用iView的Dropdown实现一个右键菜单
2019/05/06 Javascript
react实现同页面三级跳转路由布局
2019/09/26 Javascript
[01:57]2016完美“圣”典风云人物:国士无双专访
2016/12/04 DOTA
[01:19:46]EG vs Secret 2019国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21.mp4
2020/07/19 DOTA
Python的Asyncore异步Socket模块及实现端口转发的例子
2016/06/14 Python
Python实现多并发访问网站功能示例
2017/06/19 Python
详解Python文本操作相关模块
2017/06/22 Python
Python进阶之使用selenium爬取淘宝商品信息功能示例
2019/09/16 Python
Python中正则表达式对单个字符,多个字符和匹配边界等使用
2021/01/27 Python
html5自带表单验证体验优化及提示气泡修改功能
2017/09/12 HTML / CSS
HTML5 Video标签的属性、方法和事件汇总介绍
2015/04/24 HTML / CSS
使用PDF.JS插件在HTML中预览PDF文件的方法
2018/08/29 HTML / CSS
Skyscanner新西兰:全球领先的旅游搜索网站
2019/08/26 全球购物
小学生班会演讲稿
2014/01/09 职场文书
综合实践教学反思
2014/01/31 职场文书
2014年全国爱牙日宣传活动方案
2014/09/21 职场文书
python spilt()分隔字符串的实现示例
2021/05/21 Python
JavaScript架构localStorage特殊场景下二次封装操作
2022/06/21 Javascript