<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="imagetoolbar" content="no" />
<title>FancyBox 1.3.4 | Demonstration</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
!window.jQuery && document.write('<script src="jquery-1.4.3.min.js"><\/script>');
</script>
<script type="text/javascript" src="./fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="./fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="./fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<link rel="stylesheet" href="style.css" />
<script type="text/javascript">
$(document).ready(function() {
/*
* Examples - images
*/
$("a#example1").fancybox();
$("a#example2").fancybox({
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
});
$("a#example3").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none'
});
$("a#example4").fancybox({
'opacity' : true,
'overlayShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'none'
});
$("a#example5").fancybox();
$("a#example6").fancybox({
'titlePosition' : 'outside',
'overlayColor' : '#000',
'overlayOpacity' : 0.9
});
$("a#example7").fancybox({
'titlePosition' : 'inside'
});
$("a#example8").fancybox({
'titlePosition' : 'over'
});
$("a[rel=example_group]").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'over',
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' ' + title : '') + '</span>';
}
});
/*
* Examples - various
*/
$("#various1").fancybox({
'titlePosition' : 'inside',
'transitionIn' : 'none',
'transitionOut' : 'none'
});
$("#various2").fancybox();
$("#various3").fancybox({
'width' : '75%',
'height' : '75%',
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
$("#various4").fancybox({
'padding' : 0,
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none'
});
});
</script>
</head>
<body>
<div id="content">
<h1>fancybox <span>v1.3.4</span></h1>
<p>This is a demonstration. Home page</p>
<hr />
<p>
Different animations<br />
<a id="example1" href="./example/1_b.jpg"><img alt="example1" src="./example/1_s.jpg" /></a>
<a id="example2" href="./example/2_b.jpg"><img alt="example2" src="./example/2_s.jpg" /></a>
<a id="example3" href="./example/3_b.jpg"><img alt="example3" src="./example/3_s.jpg" /></a>
<a id="example4" href="./example/4_b.jpg"><img class="last" alt="example4" src="./example/4_s.jpg" /></a>
</p>
<p>
Different title positions<br />
<a id="example5" href="./example/5_b.jpg" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit."><img alt="example4" src="./example/5_s.jpg" /></a>
<a id="example6" href="./example/6_b.jpg" title="Etiam quis mi eu elit tempor facilisis id et neque. Nulla sit amet sem sapien. Vestibulum imperdiet porta ante ac ornare. Vivamus fringilla congue laoreet."><img alt="example5" src="./example/6_s.jpg" /></a>
<a id="example7" href="./example/7_b.jpg" title="Cras neque mi, semper at interdum id, dapibus in leo. Suspendisse nunc leo, eleifend sit amet iaculis et, cursus sed turpis."><img alt="example6" src="./example/7_s.jpg" /></a>
<a id="example8" href="./example/8_b.jpg" title="Sed vel sapien vel sem tempus placerat eu ut tortor. Nulla facilisi. Sed adipiscing, turpis ut cursus molestie, sem eros viverra mauris, quis sollicitudin sapien enim nec est. ras pulvinar placerat diam eu consectetur."><img class="last" alt="example7" src="./example/8_s.jpg" /></a>
</p>
<p>
Image gallery (ps, try using mouse scroll wheel)<br />
<a rel="example_group" href="./example/9_b.jpg" title="Lorem ipsum dolor sit amet"><img alt="" src="./example/9_s.jpg" /></a>
<a rel="example_group" href="./example/10_b.jpg" title=""><img alt="" src="./example/10_s.jpg" /></a>
<a rel="example_group" href="./example/11_b.jpg" title=""><img alt="" src="./example/11_s.jpg" /></a>
<a rel="example_group" href="./example/12_b.jpg" title=""><img class="last" alt="" src="./example/12_s.jpg" /></a>
</p>
<p>
Various examples
</p>
<ul>
<li><a id="various1" href="#inline1" title="Lorem ipsum dolor sit amet">Inline</a></li>
<li><a id="various2" href="ajax.txt">Ajax</a></li>
<li><a id="various3" href="http://www.moobnn.com">Iframe</a></li>
<li><a id="various4" href="http://www.adobe.com/jp/events/cs3_web_edition_tour/swfs/perform.swf">Swf</a></li>
</ul>
<div style="display: none;">
<div id="inline1" style="width:400px;height:100px;overflow:auto;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam quis mi eu elit tempor facilisis id et neque. Nulla sit amet sem sapien. Vestibulum imperdiet porta ante ac ornare. Nulla et lorem eu nibh adipiscing ultricies nec at lacus. Cras laoreet ultricies sem, at blandit mi eleifend aliquam. Nunc enim ipsum, vehicula non pretium varius, cursus ac tortor. Vivamus fringilla congue laoreet. Quisque ultrices sodales orci, quis rhoncus justo auctor in. Phasellus dui eros, bibendum eu feugiat ornare, faucibus eu mi. Nunc aliquet tempus sem, id aliquam diam varius ac. Maecenas nisl nunc, molestie vitae eleifend vel, iaculis sed magna. Aenean tempus lacus vitae orci posuere porttitor eget non felis. Donec lectus elit, aliquam nec eleifend sit amet, vestibulum sed nunc.
</div>
</div>
<p>
Ajax example will not run from your local computer and requires a server to run.
</p>
</div>
<div style="text-align:center;clear:both">
<p>适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. </p>
<p>来源：<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p>
</div>
</body>
</html>
fancybox v1.3.4 jQ插件.zip （52个子文件） 
fancybox v1.3.4 jQ插件 jiaoben927 example 
6_b.jpg 52KB 2_b.jpg 43KB 3_b.jpg 36KB 6_s.jpg 3KB 11_b.jpg 38KB 9_b.jpg 50KB 11_s.jpg 2KB 1_b.jpg 30KB 8_b.jpg 40KB 12_s.jpg 3KB 2_s.jpg 3KB 8_s.jpg 3KB 7_s.jpg 4KB 7_b.jpg 46KB 4_s.jpg 4KB 10_b.jpg 39KB 10_s.jpg 3KB 9_s.jpg 3KB 12_b.jpg 39KB 1_s.jpg 4KB 5_s.jpg 4KB 5_b.jpg 44KB 4_b.jpg 44KB 3_s.jpg 4KB
index.html 6KB
jquery-1.4.3.min.js 76KB fancybox 
fancy_nav_left.png 1KB fancy_shadow_nw.png 324B jquery.fancybox-1.3.4.js 29KB fancy_shadow_w.png 103B
blank.gif 43B fancy_close.png 1KB fancy_title_right.png 506B jquery.fancybox-1.3.4.pack.js 15KB fancy_shadow_s.png 111B fancy_shadow_sw.png 340B fancy_nav_right.png 1KB jquery.fancybox-1.3.4.css 9KB fancy_title_over.png 70B fancybox-x.png 203B fancybox.png 15KB fancy_loading.png 10KB fancy_shadow_e.png 107B fancy_shadow_n.png 106B jquery.easing-1.3.pack.js 7KB fancy_title_main.png 96B fancybox-y.png 176B fancy_title_left.png 503B fancy_shadow_ne.png 347B fancy_shadow_se.png 352B jquery.mousewheel-3.0.4.pack.js 1KB style.css 932B资源评论
芝麻粒儿
- 粉丝: 6w+
最新资源
- 学生成绩管理系统数据库逻辑结构设计
- RD-RK3588开发板+Android14平板方案20250715-1531.7z
- ATV900_Programming_Manual_CN_NHA80762_11.pdf
- 操作系统中时间片轮转调度算法
- 第二十篇 Word文档自动化：Python批量生成、模板填充与内容修改，告别繁琐排版！
- 应用python实现网页版留言功能
- VMware Tanzu实践中的DevSecOps：构建与管理云原生应用
- wzzhao-nju-AlgorithmPractice-30340-1747169745126.zip
- 实战纲领-Rust语言系统教程 + 实战案例 + 项目源码全套合集
- 一个简单计算机C语言程序的重新编写
- 实战大纲-移动应用开发教程 + 案例项目 + 完整源码实战合集（Android + iOS + 跨平台）
- 基于Matlab的风功率多步预测的仿真程序，包括LM检验+模糊熵+CEEMD模型+ARIMA模型
- 实战大纲-TypeScript系统教程 + 实战项目 + 完整案例代码大全
- Linux操作系统原理与应用-内核编程与系统调用-Ubuntu1404环境下的31421内核版本代码矫正与优化-针对Linux操作系统原理与应用第二版教材中的示例代码进行.zip
- 二维和三维添加单个喷孔的圆柱绕流算例
- 脚本开发-Markdown语法-聊天键盘工具-自动化脚本编写助手-键盘快捷输入增强-文本格式化处理-代码片段管理-多平台兼容支持-程序员效率工具-开源项目协作-文档快速生成-个性化.zip
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
