阅读更多

49顶
1踩

Web前端

原创新闻 15款ajax特效,针对Lightbox和Modal Dialog

2010-11-19 14:54 by 正式记者 HQAY0925 评论(17) 有16694人浏览
运用Lightbox和Modal Dialog可以很方便地在浏览器中展示内容,而无需重载整个页面,有了Lightbox就不必再使用浏览器弹窗了。Lightbox正愈来愈广泛地应用于媒体、网页、邮件、表格等元素的展示。

本文将为你介绍15款优秀的Lightbox和Modal Dialog特效,供网站开发者参考。

1. Facebox

facebox是一个jquery为基础的Lightbox,可显示图像,divs,或者远程页面。它的使用很简单。

下载地址:http://chriswanstrath.com/facebox



2. Colorbox

ColorBox是一个轻量级,可定制的Lightbox插件,可以在jQuery 1.3 和1.4中使用,ColorBox支持 照片,照片组,幻灯片,ajax,内联 和 iframe 框架。

下载地址:http://colorpowered.com/colorbox/



3. jQuery Lightbox Plugin

jQuery LightBox plugin是一个简洁优雅的插件,不需额外扩展代码就可以把当前页面上的图片通过一个遮罩显示出来,这主要是通过jQuery强大灵活的选择器来实现的。

下载地址:http://leandrovieira.com/projects/jquery/lightbox/



4. prettyPhoto

prettyPhoto是jQuery Lightbox的一个“克隆”。实际上它不仅能显示图片,还能显示许多的类型,比如在可能弹出的层窗口中加载视频、Flash动画、一个已布局好的网页、一个框架页等等。

下载地址:http://www.no-margin-for-errors.com/projects/prettyPhoto-jquery-lightbox-clone/



5. jQuery Dialog

这是一个 jQuery 的对话框插件,可以根据你的喜好很方便地自行定制对话框。

下载地址:http://jqueryui.com/demos/dialog/



6. Prototype Window

你可以把它用到ASP.NET,Ajax,Java等等所有网页上,可以实现改变窗口大小、最小化、最大化窗口、模型对话框、渐入渐出的渐变效果,支持皮肤等功能。现有的实例包括:模仿MAC OS的对话框,在对话框中打开一个网页,警告框,确认对话框,信息对话框,登录对话框,Ajax对话框等等。
它的原型基于对话框插件。

下载地址:http://prototype-window.xilinus.com/samples.html



7. MochaUI

MochaUI 是一个用于开发Web应用的用户界面库,基于Mootools的JavaScript框架。

下载地址:http://mochaui.com/



8. Boxy

Boxy是一个可灵活实现类似Facebook风格对话框的jQuery插件,支持对对话框进行拖拉和改变大小等操作。

下载地址:http://onehackoranother.com/projects/jquery/boxy/



9. ModalBox

Modalbox可用来增强Web应用中的用户交互,开发它的灵感来自Mac OS X的模块动态对话。

下载地址:http://www.wildbit.com/labs/modalbox/



10. Shadowbox

Shadowbox是一个在线媒体展示应用,支持绝大多数的网络媒体常用格式。Shadowbox完全是基于JavaScript和CSS编写的,高度可定制化。

下载地址:http://www.shadowbox-js.com/



11. jqModal

jqModal是jQuery的一个插件,用来在浏览器中显示通知,对话框和模型窗口。它简直如瑞士军刀一般灵活和小巧,而且它为通用目的窗口框架奠定了基础。

下载地址:http://dev.iceburg.net/jquery/jqModal/#examples



12. Highslide

Highslide是一个用Javascript写的图片影像特效浏览器,外观简洁优雅。

下载地址:http://highslide.com/



13. PiroBox

风格时尚且现代的Lightbox控件,采用jQuery开发。能够根据浏览器窗体大小自动调整展示图片大小。提供向前/向后控制链接。动态加载图片效果。易于定制。

下载地址:http://www.pirolab.it/pirobox/#howto



14. imgBox

imgBox是一个可以实现图片平滑放大效果的jQuery插件。

下载地址:http://jqueryglobe.com/labs/imgbox/



15. jQuery Tools

jQuery Tools是一个当前网站开发中最常用的UI组件集合。

下载地址:http://flowplayer.org/tools/overlay/index.html

  • 大小: 191.2 KB
  • 大小: 129 KB
  • 大小: 230.4 KB
  • 大小: 233.1 KB
  • 大小: 136.2 KB
  • 大小: 80.7 KB
  • 大小: 134.5 KB
  • 大小: 184.8 KB
  • 大小: 203.1 KB
  • 大小: 124 KB
  • 大小: 129.1 KB
  • 大小: 77.6 KB
  • 大小: 45.3 KB
  • 大小: 36.4 KB
  • 大小: 88.3 KB
  • 大小: 198.2 KB
  • 大小: 88.6 KB
  • 大小: 102.2 KB
  • 大小: 81.2 KB
  • 大小: 95 KB
  • 大小: 104 KB
  • 大小: 164.3 KB
  • 大小: 98.5 KB
  • 大小: 170.5 KB
  • 大小: 180.1 KB
  • 大小: 180.6 KB
  • 大小: 163.6 KB
  • 大小: 196.7 KB
  • 大小: 158.2 KB
  • 大小: 213.2 KB
49
1
评论 共 17 条 请登录后发表评论
17 楼 wfdqxl 2012-02-16 08:35
貌似不错,先看看。
16 楼 msaden 2011-04-25 15:37
绝对值得收藏
15 楼 zcj007b 2011-03-06 22:03
收藏, 好东西! 确实非常之好看
14 楼 conhaifeng 2011-03-04 09:41
nice 已收藏。
13 楼 Tony恋云 2011-01-09 16:59
强。。。
12 楼 lvjinhua 2011-01-02 18:50
确实很好很强大。
11 楼 w286332849 2010-12-03 15:25
收藏起来,有时间再研究~
10 楼 sgh317 2010-11-26 15:11
9 楼 Morgan0916 2010-11-25 10:16
收藏啦,呵呵
8 楼 meteortianxia 2010-11-22 09:56
好东西!收藏
7 楼 wenxiang_tune 2010-11-22 08:59
用不上。。。我希望出点prototype的。。。
6 楼 ddl1st 2010-11-21 19:17
mark~
5 楼 hilly 2010-11-21 19:07
verygood!
4 楼 liu9822 2010-11-21 14:11
很炫丽~~~
3 楼 xuhang1128 2010-11-20 20:27
jquery越来越好,虽然用不着,但是值得关注
2 楼 jorneyR 2010-11-20 15:51
绝对值得收藏
1 楼 liyaxi 2010-11-20 14:50
收藏, 好东西!

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • Apache2.2详细操作手册

    linux下配置Apache的操作手册,很详细

  • Apache Ant 中文手册

    引言       Apache Ant是一个基于Java的编译工具。它从功能上类似于make,但它以克服了make的缺点。       为什么在make, gnumake, nmake, jam这些编译工具后,还要产生一个Ant呢?因为这些编译工具都有一定的限制。Ant的最初开发者在开发跨平台的应用时,发现以前的那些开发工具都有一定的限制。例如make工具,它是基于Shell的,它判断一系

  • Apache2.2 - 中文手册

    Apache HTTP Server是Apache软件基金会的一个开放源代码的网页服务器软件,可以在大多数计算机操作系统中运行。由于其跨平台和安全性,被广泛使用,是最流行的Web服务器软件之一。它快速、

  • Apache Ant操作手册

    Apache Ant操作手册,ant使用方法

  • Apache Ant_中文手册

    Apache_Ant_中文手册.doc apache ant 讲解。。。

  • 2.3 15款ajax特效,针对Lightbox和Modal Dialog

    1. Facebox facebox是一个jquery为基础的Lightbox,可显示图像,divs,或者远程页面。它的使用很简单。...ColorBox是一个轻量级,可定制的Lightbox插件,可以在jQuery 1.3 和1.4中使用,ColorBox支持 照片,照...

  • 15个非常漂亮的ajax弹窗效果 针对Lightbox和Modal Dialog

     本文将为你介绍15款优秀的Lightbox和Modal Dialog特效,供网站开发者参考。  1. Facebox  facebox是一个jquery为基础的Lightbox,可显示图像,divs,或者远程页面。它的使用很简单。  

  • 30个非常棒的Ajax灯箱(Lightbox)和模式对话框解决方案

    Facebox是一个基于jQuery实现,Facebook风格的Lightbox。可以用于展示图片,Divs, 或者整个远程页面。它简单易用。 2. Lightbox2 Lightbox is a simple, unobtrusive script used to overlay images on the ...

  • AJAX设计模式之Lightbox

    什么是Lightbox?看了下面的例子你就会明白:http://www.cnbruce.com/test/lightbox/ 以下文章为引用:Lightbox的效果类似于WinXP操作系统的注销/关机对话框,除去屏幕中心位置的对话框,其他的区域都以淡出的效果...

  • 推荐15款响应式的 jQuery Lightbox 插件

    在这个列表中,我们编制了15款响应式的 jQuery 灯箱库,这将有助于开发人员创建和设计美观的网站。 您可能感兴趣的相关文章 网站开发中很有用的 jQuery 效果【附源码】 分享35个让人惊讶的 CSS3 动画效果演示 十分...

  • Apache Ant的使用(1)——基础使用教程

    一、什么是Ant 以下介绍来自百度百科: Apache Ant,是一个将软件编译、测试、部署等步骤联系在一起加以自动化的一个工具,大多用于Java环境中的软件开发。由Apache软件基金会所提供。 我们在使用Eclipse开发Android应用时,Eclipse使用的项目构建工具就是Ant。 用户群:大多数的Java设计都被用于管理大量信息流,例如纽约州就使用Apache Ant去管理

  • Apache Ant 快速参考手册

    <br />    本文将对Apache Ant中常用的标签(任务),参数配置进行介绍,以供快速参考使用。<br /> <br />    Apache Ant的主页在这里:http://ant.apache.org/<br /> <br />一、Ant简介<br />    Ant是一种基于Java的build工具,旨在改进make工具的缺点和局限性。一般来说,基于shell的makefile在使用中或许会带来一些问题,比如使用了特定平台的命令造成移植问题以及文本tab问题等。而且在用于编译Java代码时

  • apache的基本使用

    一、认识apache        apache企业中常用的web服务,也是世界上使用排名第一的web服务器,用来提供http://(超文本传输协议)。 二、apache的安装部署         1、yum install httpd -y   :下载并安装apache服务器(在linux系统的镜像中有安装包)                               2、syst

  • 【学习手册】Apache pulsar操作手册

    pulsar的安装部署、api常规操作及权限验证

  • apache用户指导手册

    随着 linux的不断普及,很多的朋友把redhat安装到了自己的计算机上,从此也就开始了对redhat的摸索。我在这里也把我的一点心得体会告诉大家,希望对大家有所帮助。apache 的安装通常来说,大家在安装时可以选择安装web server ,并在inte.net services中开启httpd这一相服务,这样系统就会自动的安装好apache,并且在系统第一次启动时启动httpd进程。在作好

  • 【整理】最佳jQuery窗口插件(Modal Dialog Plugins)

    在Ajax中经常用到的弹出窗口和遮蔽窗口。 BoxyBoxy是一个灵活的、Facebook-style对话框,为jQuery支持并拖拽tweening大小。它不同于其他叠我见过提供一个对象的接口来控制对话之后,他们已经创造了。操作简单,boxy...

  • Ajax 改造,第 4 部分: 用 jQuery 和 Ajax 表单改造现有站点

    关于本文 本文将逐步引导您使用 ...除了 Ajax 技术和最佳实践之外,您还将了解 Ajax 如何通过渐进增强原理改善用户体验。 本文假设您已经牢固掌握 HTML 和 CSS,基本了解 JavaScript 和 Ajax 编程技术。示例应用

  • LightBox 对话框

    http://hi.baidu.com/d%B6%FEd/blog/item/cd3f12501d6c9611367abec1.htmlFrom: http://www.dottony.com/30-useful-ajax-lightbox-and-modal-dialog-solutions/Modal dialog, windows or a popular term lightbox

  • AJAX之lightBox

    Lightbox的效果类似于WinXP操作系统的注销/关机对话框,除去屏幕中心... Lightbox的作用则相当于从前只在IE中被支持的"Modal Dialog";现在在FireFox也可用window.open(url, name, " modal=yes ");来实现同样的效果...

Global site tag (gtag.js) - Google Analytics