jQuery弹出窗口插件 FancyBox

CC BY-NC 3.0
JavaScript
跨平台
2009-08-05
红薯

FancyBox是一款基于jquery开发的类Lightbox插件。支持对放大的图片添加阴影效果,对于一组相关的图片添加导航操作按纽,该lightbox除了能够展示图片之外,还可以展示iframed内容, 通过css自定义外观。

相对与Lightbox而言,阴影效果更好。但是比Lightbox绚丽。

使用很是简单,可以参照Lightbox,修改添加代码。

示例代码:

$(document).ready(function() { 
	/* This is basic - uses default settings */ 
	$("a#single_image").fancybox(); 
	/* Using custom settings */ 
	$("a#inline").fancybox({ 'hideOnContentClick': true }); 
	$("a.group").fancybox({ 
		'zoomSpeedIn': 300, 
		'zoomSpeedOut': 300, 
		'overlayShow': false 
	}); 
});

使用效果图:

加载中

评论(6)

水母干
水母干
演示用的效果图看着太压抑了 FancyBox
liuweihug
liuweihug
jquery简单实用弹出框控件-Colorbox使用 http://www.suchso.com/UIweb/jquery-plug-use-Colorbox.html FancyBox
彭博
彭博
Jcrop + FancyBox 上传组件化搞定....3
幻影浪子
幻影浪子
商业使用要收费.. FancyBox
彭博
彭博
FancyBox 2.0 要用得收费呀,还是自己改改 1.3.4 吧

FancyBox 2.0 发布,全新的 jQuery 弹出层

FancyBox是一款基于jquery开发的类Lightbox插件。支持对放大的图片添加阴影效果,对于一组相关的图片添加导航操作按纽,该lightbox除了能够展示图片之外,还可以展示iframed内容, 通过css自...

2011/11/23 15:04

开源中国1-4期软件推荐 jQuery弹出窗口插件FancyBox

开源中国社区1-4期(1月份第4周)推荐的开源软件是FancyBox,FancyBox是一款jQuery弹出窗口插件。 FancyBox是一款基于jquery开发的类Lightbox插件。支持对放大的图片添加阴影效果,对于一组相...

2011/01/24 09:12

没有更多内容

加载失败,请刷新页面

没有更多内容

5
回答
fancybox如何在一个页面支持多个相册

现在是页面所有的图片都在一个相册里面

2011/02/22 08:54
2
回答
在fancybox弹出窗口中使用kindeditor的问题

请问有没有人在弹出层中使用KindEditor编辑器(例如FancyBox弹出窗口)?是不是KindEditor不支持?我一直没有成功。

2013/03/30 17:43
1
回答
fancybox显示非直接图片时错误

原来的结构是这样: <li style="display: list-item;"> <a title="1.jpg" data-fancybox-g...

2014/02/28 23:07
1
回答
FancyBox异步加载数据,IE6下无法显示弹出层?

1.正常情况下,在页面上显示<a class="various" href='#inline'>显示弹出层</a>,然后点击这个链接,会显示弹出层 2.如...

2013/09/04 18:35
1
回答
fancybox相册功能

@绿水无痕 你好,想跟你请教个问题:我在使用fancybox画廊功能的时候,图片始终显示的是第一张图片,不知道问题会出在什么地方呢?

2013/09/02 16:51
2
回答
如何使用fancybox实现JSP页面登录然后自动关闭?

网站主页面有登录按钮,点击以后弹出fancybox,内容是一个jsp登录表单页面。 希望实现: fancybox里的表单提交以后,如果登录成功则fancy...

2013/08/19 21:46
4
回答
关于fancybox多个图库展示问题

@绿水无痕 你好,想跟你请教个问题: 您1年前发表的关于《fancybox多个图库展示问题》,最后您自己解决了,请问可不可以将相关的代码发送给我,谢谢! ...

2013/05/10 12:08
1
回答
fancybox基础问题,无法实现弹出窗口效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3...

2012/12/30 21:20
2
回答
FancyBox弹出其他页面,父页面出现滚动条!好悲剧啊!求解决啊!

FancyBox弹出其他页面,父页面出现滚动条!好悲剧啊!父页面还能滚动~~求高手解决!

2013/04/08 15:51
5
回答
fancybox 能不能在页面加载的时候就弹出
红薯 的回答 2011/03/02 08:32
最佳答案
$(document).ready(function() { $.fancybox('要显示的弹出信息内容'); });

没有更多内容

加载失败,请刷新页面

5行代码为你的博客引入fancybox

> 欢迎访问 [陈同学博客原文](https://chenyongjun.vip/articles/46) > fancybox [官网](http://fancyapps.com/fancybox/3/)、[github](https://github.com/fancyapps/fancybox) > 官网介绍:...

2018/06/17 21:38
3
0
jQuery Fancybox插件使用参数详解

今天给大家介绍的jquery图片播放插件叫Fancybox,相比LightBox来说,Fancybox相对庞大点,配置也更丰富一些,相信你会喜欢的。

2014/04/18 18:34
3.9K
0
Jquery fancybox 图片弹出放大

前些天做一个网站,突发奇想的想要做弹出图片那种显示,下面把代码分享给大家,很简单,很好用: 1.网页的<head>部分引入依赖的JS和CSS <!-- Add jQuery library --> <script type="text/ja...

2012/08/09 09:31
703
0
【jquery】fancybox 是一款优秀的 jquery 弹出层展示插件

今天给大家分享一款优秀的 jquery 弹出层展示插件 fancybox。它除了能够展示图片之外,还可以展示 flash、iframe 内容、html 文本以及 ajax 调用,我们可以通过 css 来自定义外观。 fancybox...

2015/05/27 11:16
199
0
jquery Fancybox使用教程

Fancybox是一款基于jquery的对图片展示播放的插件,当然,它html文本、flash动画、iframe以及ajax也予以支持。还可以通过css自定义外观,阴影效果超级赞! 演示效果:http://www.phpddt.com...

2013/06/29 21:53
1K
0
FancyBox ,比LightBox更绚丽的效果

官方教程: 1,首先,你应当确定你的文档中应有一个有效的文档声明(即DOCTYPE声明),这是保证FancyBox效果能正常实现的前提条件。 2,请将以下js文件包含在你的效果展示页面 < script type ...

2011/03/04 09:32
472
0
Iframe popup plugin(弹出一个框架url页面)

Iframe popup plugin is specially developed to display any webpage in the popup window using web url. It uses fancybox to display popup in iframe....

2014/08/14 15:56
35
0
Fancybox使用

FancyBox是一款基于jquery开发的插件。可以对放大的图片添加阴影效果,对于一组相关的图片添加导航操作按纽,该插件除了能够展示图片之外,还可以展示iframed内容,调用ajax等, 通过css自定...

2013/03/16 18:42
4.6K
0
Bootstrap与Fancybox不兼容的处理方法

做一静态页面,用到了Bootstrap 2.3.0和Fancybox 2.1.4。 在Chrome、FireFox以及Safari (Win)中Fancybox可以正常弹出图片,但是偏偏到了Opera中死活样式不对。放大的图片出来了,但是网页内容...

2013/04/01 16:13
533
0
jQuery在网页应用中常用的插件

一、工具提示(tooltip): 1、Poshy Tip : 演示: http://vadikom.com/demos/poshytip/ 二、弹出窗口 1、FancyBox 演示: http://fancyapps.com/fancybox/ 三、表单操作 1、jQuery Form Plu...

2013/10/25 18:06
53
0

没有更多内容

加载失败,请刷新页面

返回顶部
顶部