QQ客服
当前位置 : 首页 > 代码 > html5 css3 > html5实例 > html5全屏3D旋转图片幻灯片

html5全屏3D旋转图片幻灯片

这是一款jQuery响应式全屏3D旋转图片切换。该特效使用GSAP的TweenMax库和TimelineMax库来制作,实现图片的3D缩放和立方体旋转幻灯片切换效果。
分享到微信朋友圈
X

使用方法:

1、head引入css文件

<link rel="stylesheet" type="text/css" href="assets/css/demo.css" />

2、head引入js文件

<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>

3、body引入HTML代码

<!-- coidea:loader START -->
<div class="loader">
  <div class="lds-ripple">
	<div></div>
	<div></div>
  </div>
</div>
<!-- coidea:loader END -->


<!-- coidea:slideshow:navigation START -->
<nav id="nav">
  <button id="prev" class="nav-item" data-increment="-1">
	<img src="assets/img/icon-prev.png" alt="prev" />      </button>
  <button id="next" class="nav-item" data-increment="1">
	<img src="assets/img/icon-next.png" alt="next" />      </button>
</nav>
<!-- coidea:slideshow:navigation END -->

<!-- coidea:slideshow START -->
<section class="coidea-3d-carousel">
  <div class="stage">
	
	<!-- coidea:slideshow:item START -->
	<div class="item">
	  <div class="bcg" style="background-image: url(assets/img/img-1.jpeg);"></div>
	  <div class="content">
		<div class="description">
		  <p class="description-target">1483 - 1843</p>
		</div>
		<div class="headline">
		  <h2 class="headline-target">Dream big</h2>
		</div>
		<div class="discover-more">
		  <a href="#" class="discover-more-target">Discover More</a>            </div>
	  </div>
	</div>
	<!-- coidea:slideshow:item END -->

	<!-- coidea:slideshow:item START -->
	<div class="item">
	  <div class="bcg" style="background-image: url(assets/img/img-2.jpeg);"></div>
	  <div class="content">
		<div class="description">
		  <p class="description-target">1723 - 1798</p>
		</div>
		<div class="headline">
		  <h2 class="headline-target">Pray bigger</h2>
		</div>
		<div class="discover-more">
		  <a href="#" class="discover-more-target">Discover More</a>            </div>
	  </div>
	</div>
	<!-- coidea:slideshow:item END -->

	<!-- coidea:slideshow:item START -->
	<div class="item">
	  <div class="bcg" style="background-image: url(assets/img/img-3.jpeg);"></div>
	  <div class="content">
		<div class="description">
		  <p class="description-target">1845 - 1853</p>
		</div>
		<div class="headline">
		  <h2 class="headline-target">Keep going</h2>
		</div>
		<div class="discover-more">
		  <a href="#" class="discover-more-target">Discover More</a>            </div>
	  </div>
	</div>
	<!-- coidea:slideshow:item END -->

  </div>
</section>
<!-- coidea:slideshow END -->

<script src="assets/js/TweenMax.min.js"></script>
<script src="assets/js/imagesloaded.pkgd.min.js"></script>
<script src="assets/js/demo.js"></script>
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
全红彩票 www.55sb.com-福彩三地历史开奖号| www.48pb.com-泰国的彩票怎么查询| www.403055.com-038彩票最新彩娱| www.296610.com-湖北福利彩票出奖| www.a17.biz-新浪爱彩是真的吗| www.528833.com-歌词里最美的彩虹| www.12vw.com-彩智彩票app| www.88vj.com-彩票有效期是多久| www.4678.cm-两人特殊买彩票| www.1157.in-谜材彩票术语大全| www.465320.com-什么叫彩票注数| www.606525.com-彩票app无停售| www.tb31.com-时时彩中奖-| www.75580.com-快三二同号中奖金额| www.070119.com-91彩神注册码| www.513531.com-重庆时时彩五分| www.814829.com-中国福利3d彩| www.043039.com-足球彩票买不了| www.189303.com-内蒙快三~定牛| www.167521.com-快三群里都是托吗| www.255825.com-彩票51中彩可靠吗| www.41py.com-辽宁体彩爱彩乐| www.66120.com-彩票在线机选摇一摇| www.686128.com-福彩体彩开奖查询| www.832235.com-福彩3d藏宝图| www.953958.com-好彩双爆珠新加坡| 福彩www.15355p.com| www.kz00.com-132彩票注册官网| www.u61.cc-福彩三d迷语| www.50ms.com-足彩任九在线过滤| www.796548.com-冠彩网北京胆王| www.879631.com-北控京彩合法吗| www.994069.com-9928彩票-| www.cw99.cc-网易彩票平台可靠吗| www.e78.club-七乐彩直播现场直播| www.179857.com-江苏彩票巨奖| www.372908.com-体彩排五奖号| www.487744.com-久久彩票平台坑人吗| www.585882.com-福彩快三单双大小| www.667155.com-3b福彩实战擂台| www.735927.com-游戏快三是什么彩票| www.871508.com-北京快三助手版| www.615922.com-美狮彩票安全吗| www.689600.com-齐鲁七乐彩30选7| www.678451.com-海南七星彩票| www.254537.com-好彩投app没了| www.392144.com-福彩体彩开奖| www.7713.com-山东分分彩开奖号码| www.684103.com-竞彩比分三串一牛人| www.931902.com-赵公明彩票预测| www.ha71.com-彩八彩票骗了十万| www.wu11.com-彩票注册送38| www.86id.com-和乐彩票注册| www.2736.wang-中国福利彩票网山西| www.8508.net-竞彩该如何投资| www.50488.cc-足球彩票网址| www.2946.pw-体彩店装修流程| www.zz11.com-中国竞彩网点| www.225781.com-福彩3d辽宁真人| www.698739.com-河北快三规则及奖金| www.790391.com-好彩1app-| www.28985.cc-彩色激光打印机| www.473666.cc-福建彩票几点开奖| www.561433.com-金手指彩票指南| www.646465.com-博彩宝马网站| www.629706.com-788彩票-| www.720219.com-幸运七星彩手机投注| www.828722.com-138cp彩票-| www.909590.com-福彩论坛彩界精英| www.979028.com-淘淘彩票app| www.297.red-七星彩没人买| www.6773.top-多赢钱彩票-| www.31184.com-新彩网3d字迷| www.92192.cc-喜中彩票彩天下| www.753962.com-彩票彩宝贝下载| www.948899.com-福彩内部qq号骗局| www.991966.cc-福利彩票如何购买| www.br83.com-喜盈门彩票app| www.ro65.com-在哪里可以买七星彩| www.083226.com-老9乐购彩票app| www.d66.org-中圆彩吧更懂和民| www.948601.com-彩票刮刮卡中奖秘密| www.17bn.com-彩票店运营方式| www.8883.tv-竞彩好中吗-| www.001827.com-买大小彩票-| www.127762.com-下彩网网站-| www.605383.com-苹果5彩色版| www.698392.com-网上买彩票倍投好吗| www.816720.com-平台时时彩避免追杀| www.884687.com-上海体彩网快三| www.997348.com-苹果彩票投注app| www.cs61.com-乐彩-| www.we65.com-甘肃快三最大遗漏| www.22mz.com-吉祥彩票骗局| www.0196.cn-国彩网合买彩票受骗| www.577537.com-上海快三开奖转盘| www.ij31.com-福彩论坛-| www.05oc.com-福彩和值遗漏分析| www.91or.com-彩经网怎么了| www.747141.com-禁止出售彩票| www.947751.com-爱彩乐黑网-| 彩票500万www.cp500.biz| www.055325.com-精彩网名-| www.972126.com-湖北彩票案-| www.ql36.com-福彩跑马幸运走势图| www.00cg.com-七彩乐透开奖结果| www.73oz.com-彩票分析助手| www.219455.com-彩色混凝土路面做法| www.011093.com-福彩手机彩票网| www.gj85.com-众彩彩票-| www.98724.com-竞彩足球买量| www.088469.com-足彩开奖查询| www.895005.com-体彩6十幸运购彩| www.950997.com-立彩是合法的吗| www.998066.com-pk彩票是真的吗| www.as16.com-优游彩票平台下载| www.rn91.com-彩票大家玩2017| www.365530.com-彩铅唯美风景画教程| www.652792.com-500彩票网直播| www.020925.com-大同彩票合买app| www.5482.vip-长春彩艺-| 500彩票网www.622105.com| www.d71.top-快三预测软件原理| www.218626.com-快开彩票-| www.7932.org-彩票到底多少种| www.46607.com-最稳定的时时彩网址| www.029588.cc-滴滴彩票app| www.000431.com-极速时时彩是假的吗| www.111762.com-七星彩票送彩金| www.322616.com-竞彩比分玩法中奖| www.553040.com-福彩3d高手论坛| www.656702.com-欧洲杯彩票app| www.728544.com-京东彩票网站| www.821504.com-昆明有体彩福彩转让| www.884817.com-如何研究彩票走势| www.999505.com-运彩票-| www.nx2.com-河北省彩票开奖查询| www.05428.com-哪里有买彩票的网站| www.49992.cc-彩神广东11选5| www.022272.com-注册彩票送体验金| www.121014.com-网上买彩票被骗了| www.198365.com-下载大发彩票app| www.65bk.com-微信里的中华彩| www.66545.cc-福彩直播视频| www.396577.com-2mcc彩票-| www.566782.com-网赌快三输了很多钱| www.83ef.com-喝彩中华蔡正仁| www.1265.cc-体彩开奖福彩直播| www.7096.cm-七彩珠心算-| www.589365.com-网上彩票骗局计划| www.620391.com-海外彩票网-| www.209494.com-河北燕赵风彩排列5| www.336171.com-甘肃时时彩-| www.669362.com-福建福彩中心在哪里| www.323367.com-吹吹七星彩头尾论坛| www.396815.com-金钱豹彩票娱乐平台| www.478851.com-神彩通网-| www.6852.com-丰彩注册-| www.44154.com-彩彩吧图库第二版| www.002175.com-北京快三多久一班车| www.66926.cc-附近的彩票店| www.845206.com-彩票手机做号软件| www.944350.com-体彩店试题-| www.994220.com-体育福利彩票刮刮乐|