`
icejadelove
  • 浏览: 138261 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

最佳jQuery窗口插件(Modal Dialog Plugins)

阅读更多

以下我全试了, FancyBox, Boxy, FaceBox, BlockUI这四个最好, 它们各有所长.

FancyBox

21Andy.com译: FancyBox非常小且容易使用, 有很好的外观, 简洁和容易扩展的CSS, 可惜暂不支持Modal.
The FancyBox plugin is very simple and easy to implement, looks fantastic out of the box, and has very clean CSS for you to expand upon or modify to your liking. Unfortunately it lacks some features that others may have such as modal support but it is work checking out.
最佳jQuery窗口插件(Modal Dialog Plugins) 079294b396ffff77 thumb

  • 外观: 5/5 分
  • 容易使用: 5/5 分
  • 功能: 3/5 分
  • 图片文字:
  • 相册Rel:
  • 内联支持:
  • Iframe支持:
  • Modal支持:
  • 可定制性:
  • 下载: FancyBox

Boxy

Boxy is probably my favorite modal dialog jquery plugin so far, its not bad looking out of the box, very simple to implement, and has quite a few strong/simplistic features which are very polished. If you are in need of this sort of functionality for an application check it out!

最佳jQuery窗口插件(Modal Dialog Plugins) d24441ec909e1397

  • 外观: 4/5 分
  • 容易使用: 5/5 分
  • 功能: 4/5 分
  • 图片文字:
  • 相册Rel:
  • 内联支持:
  • Iframe支持:
  • Modal支持:
  • 可定制性:
  • 下载: Boxy

FaceBox

21Andy.com译: 懒得译了, 手酸.... -_!!
Although this popup script looks pretty slick I found that it loads fairly clunky, and seriously lacks in polish/features. I had to adjust paths right off the bat to get images to display properly, and it does not have basic support such as the rel attribute for galleries, title attribute for captions etc.

That being said if you love the Facebook popup look check it out!
最佳jQuery窗口插件(Modal Dialog Plugins) 768af12649c46b53 thumb

  • 外观: 4/5 分
  • 容易使用: 4/5 分
  • 功能: 2/5 分
  • 图片文字:
  • 相册Rel:
  • 内联支持:
  • Iframe支持:
  • Modal支持:
  • 可定制性:
  • 下载: FaceBox

BlockUI

This again is more of a developers dialog solution, and a pretty good one at that. Along with providing highly customizable JavaScript modal dialog support, it also can block page elements, or the entire page until Ajax (or other processing) is complete, which is very handy for applications.

BlockUI is ugly out of the box however the site has some good clean examples and how to implement them. It is a little strange in the fact that CSS is applied via JavaScript configuration rather than a stylesheet.

最佳jQuery窗口插件(Modal Dialog Plugins) 9fcceed088a2304c

  • 外观: 1/5 分
  • 容易使用: 3/5 分
  • 功能: 5/5 分
  • 图片文字:
  • 相册Rel:
  • 内联支持:
  • Iframe支持:
  • Modal支持:
  • 可定制性:
  • 下载: BlockUI

Impromptu

21Andy.com译: 懒得译了, 手酸.... -_!!
Not that Impromptu looks bad, I would hardly call it generic enough to be suitable for every site out of the box. For those of you looking for image support this is probably not the popup plugin for you, as it primarily was created for dialog support replacing alert(), prompt() etc. I did however get it working with images pretty quick, but either way this is more of an dialog popup script.

最佳jQuery窗口插件(Modal Dialog Plugins) 87a867d6bccd5b05

  • 外观: 3/5 分
  • 容易使用: 3/5 分
  • 功能: 4/5 分
  • 图片文字:
  • 相册Rel:
  • 内联支持:
  • Iframe支持:
  • Modal支持:
  • 可定制性:
  • 下载: Impromptu

nyroModal

This popup dialog plugin has tons of features and an overall sexy look and smooth animation. My main problem with this one is that the consistency was no really there it did nto feel as solid as some of the others and I was getting strange CSS break-age with some images/pages.

最佳jQuery窗口插件(Modal Dialog Plugins) 2f333e7266c06326 thumb

  • 外观: 4/5 分
  • 容易使用: 4/5 分
  • 功能: 5/5 分
  • 图片文字:
  • 相册Rel:
  • 内联支持:
  • Iframe支持:
  • Modal支持:
  • 可定制性:
  • 下载: nyroModal

FancyZoom

Another Fancy-something?? I guess so! they are very similar too, taking the Apple approach. I find this one to be fine, but the animations lag a little which I think really decreases user experience. Packing nearly the same features as FancyBox (less) I would suggest checking it out before this one.

最佳jQuery窗口插件(Modal Dialog Plugins) 42b65514375b0b27 thumb

  • 外观: 3/5 分
  • 容易使用: 4/5 分
  • 功能: 1/5 分
  • 图片文字:
  • 相册Rel:
  • 内联支持:
  • Iframe支持:
  • Modal支持:
  • 可定制性:
  • 下载: FancyZoom

Flyout

The most interesting thing about Flyout is its support for easing functions, making the animations much more amusing, as well as some interesting loading effects. Other than the effects this plugin seriously lacks in standard functionality and because of that I would certainly not recommend it.

最佳jQuery窗口插件(Modal Dialog Plugins) b0626560a37ae570 thumb

  • 外观: 2/5 分
  • 容易使用: 4/5 分
  • 功能: 1/5 分
  • 图片文字:
  • 相册Rel:
  • 内联支持:
  • Iframe支持:
  • Modal支持:
  • 可定制性:
  • 下载: Flyout

其他jQuery窗口插件(Modal Dialog Plugins)

simplemodal: http://www.ericmmartin.com/projects/simplemodal/
jqModal: http://dev.iceburg.net/jquery/jqModal/#examples
simplemodal、jqModal 。这两个是最简单的,灵活性很好,需要配置的多,学习成本高。
如果你希望定制自己的Dialog,这两个插件,可以作为基础包,在基础包在封装一下。就可以很方便的满足你的要求。

http://jquery.com/demo/thickbox/
thickbox是我以前用了很长时间的, 现在不推荐了.

http://www.malsup.com/jquery/block/
BlockUI效果很好。而且官方的帮助也很详细,如果只是简单的使用遮蔽,推荐使用,上手也容易。

http://docs.jquery.com/UI/Dialog
官方的要,还要引几个扩展的JS,支持窗口缩放什么的,但生产的代码也太复杂了,不推荐。

Tags: Dialog, jQuery, Modal, plugin, 插件, 窗口

本文地址: http://www.21andy.com/blog/20090611/1324.html

分享到:
评论

相关推荐

    Jquery库与插件

    3. **模态对话框**:如jQuery UI的Dialog或Bootstrap的Modal,用于创建弹出窗口,常用于显示警告、确认信息或嵌入内容。 4. **日期和时间选择器**:如jQuery UI的DatePicker或Moment.js,帮助用户方便地选择日期和...

    分享网络收集100个常用的jquery特效和插件

    5. **模态窗口**:如jQuery UI Dialog、Bootstrap Modal,用于弹出信息、确认对话框或者嵌入内容,不打断用户的浏览流程。 6. **表单验证**:如jQuery Validation Plugin,帮助开发者快速实现表单数据的有效性检查...

    java弹出窗口大全

    4. **jQuery Plugins**:还有许多第三方jQuery插件,如toastr、noty等,用于创建各种类型的弹出通知或消息。 通过这个"java弹出窗口大全"的压缩包,开发者可以学习到如何在不同的环境中实现弹出窗口功能,提升用户...

    Jquery开发类库+一个实例

    4. **模态框**: Bootstrap 的 Modal 插件或 jQuery UI 的 Dialog 提供了弹出窗口功能,常用于警告、确认或展示内容。 ### 三、jQuery 实例分析 在提供的压缩包中,"Jquery类库及实例"可能包含了一个简单的jQuery...

    前端项目-jquery-ui-bootstrap.zip

    4. **JavaScript插件(JavaScript Plugins)**:Bootstrap包含了一些基于jQuery的插件,如下拉菜单(Dropdowns)、轮播(Carousel)、模态(Modal)等,它们增强了网页的交互性。 5. **自定义(Customization)**:...

    jQuery外部调用弹窗代码.zip

    5. **弹窗插件(Modal Plugins)**:在jQuery生态中,有许多现成的弹窗插件,如jQuery UI的Dialog或Bootstrap的Modal。如果"jiaoben7120"是自定义的弹窗实现,那么可能包含了自己的逻辑来创建、显示和控制弹窗。 6....

    精美前台模板

    jQuery EasyUI是一个轻量级的JavaScript库,它构建在jQuery之上,提供了大量的预定义组件和交互效果,如窗口、表格、下拉菜单、按钮等,极大地简化了前端开发工作,尤其适合快速构建企业级的后台管理系统。...

    boostrap_learn

    9. **脚本插件(JavaScript Plugins)**:除了CSS,Bootstrap还提供了许多基于jQuery的JavaScript插件,如折叠(collapse)、滚动监听(scrollspy)和轮播(carousel)。这些插件可以通过添加特定的类和数据属性激活...

    bootstrap:Utilizando类引导程序

    9. **模态(Modals)**:模态对话框由`.modal`类控制,`.modal-dialog`和`.modal-content`定义对话框的样式,`.modal-header`、`.modal-body`、`.modal-footer`则定义模态的各个部分。 10. **JavaScript插件...

    Asp.net MVC scheduler的实现方法详解

    <div class="modal-dialog modal-lg"> <!-- Modal content --> <div class="modal-content"> @using(Html.BeginForm("AssignTask", "PMPlan", FormMethod.Post, new {@class="form-horizontal", role="form"})) ...

Global site tag (gtag.js) - Google Analytics