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.807165.com-竞彩按比例投注计划| www.2380.org-七彩西游记极速播放| www.823309.com-博兴彩钢瓦厂| www.693258.com-爱乐透体彩app| www.824827.com-郑州福利彩票兑奖点| www.963087.com-江苏福彩如何兑奖| www.fz07.com-江苏快三代理招收| www.sg95.com-幸运时时彩-| www.171865.cc-彩票快三开奖结果| www.385061.com-什么叫彩票源码| www.641623.com-福彩标志含义| www.931683.com-贵州快三投注知识| www.928335.com-分分彩计算公式软件| www.cz20.com-约彩365-| www.20ig.com-新浪胜负彩彩票| www.tl80.com-安徽快三胆拖投注| www.245.tv-华盛娱乐时时彩平台| www.016267.com-彩票计划员可信吗| www.772442.com-篮球博彩app| www.3vp.cc-体彩频道-| www.023911.com-境外彩票骗局| www.92db.cc-手机赚佣金平台彩票| www.079448.com-3d彩票怎么玩的| www.262676.com-福利彩票开奖查询福| www.26jb.com-体彩手机在线正规吗| www.566899.cc-青岛市彩票兑奖中心| www.32537.cc-好运来快三输死| www.117364.com-新浪足彩任九投注| www.877875.com-福利彩票中3个号码| www.ml86.com-时时彩app哪个好| www.222813.com-极速快三计划群| www.531295.com-彩93平台怎么样| www.22684.com-彩票打票员怎么提成| www.096322.com-郭果大乐透众彩网| www.568948.com-手机版福利彩票| www.664527.com-七乐彩开奖对比器| www.745163.com-6234彩票可信吗| www.aw05.com-内蒙快三23号开奖| www.02tw.com-微博世界杯彩票提现| www.676.in-跟时时彩计划反买| www.762121.com-福利彩票快三官网| www.835897.com-彩运8计划网址| www.905373.com-91彩票倒闭了吗| www.975633.com-湖南长沙福彩中心| www.cp2560.com-江苏快三大小规则| www.41lw.com-鸿运彩票怎么提现| www.542820.cc-网上达人彩票| www.11558.cc-羊城晚报晚晚好彩| www.64484.com-竞彩足球下载| www.bq11.com-七乐彩票是真的吗| www.202987.com-广东福彩快3怎么玩| www.702233.com-彩票信用玩法区别| www.388299.com-67彩是骗局吗| www.500928.com-彩票员工被判11年| www.584399.com-彩虹正版易支付| www.657174.com-360彩票登录| www.736069.com-玩彩票的有挣钱的没| www.815871.com-福彩和值尾走势图| www.1229.org-体彩4串4什么意思| www.947486.com-排列3双彩图| www.024996.com-真锅彩介绍-| www.155438.com-网上微彩彩票靠谱吗| www.865028.com-中国福彩手机版| www.951706.com-必赢彩票是真的吗| www.0917.space-时时彩追号稳赢技术| www.9231.online新浪竞技彩票中心| www.569708.com-三的开奖号码福彩网| www.12218.com-96彩票正规吗| www.679906.com-巨龙彩票正规么| www.lm54.com-中彩软件提现不了| www.98911.cc-时时彩假吗-| www.977650.com-豪彩娱乐app| www.am04.cc-河北体彩前三组遗漏| www.580389.com-826网站彩票| www.675524.cc-广州汇彩路酒店| www.755569.com-中彩缘无锡快三| www.825638.com-四川福骰快三| www.890044.com-竞彩网篮球比分| www.rx38.com-51亿彩票-| www.9627.xyz-体彩排列三胆码| www.258970.com-竞彩比分直播老版本| www.42708.com-属虎今年买彩票号码| www.50979.com-75彩票可靠吗| www.22331.cc-万豪福彩大转盘| www.087583.com-彩票预测软件怎么样| www.66ud.com-拉菲时时彩2| www.6174.live-体育彩票是不是搞假| www.27581.cc-双色球彩票计算器| www.98875.com-快三高手求带| www.091192.com-365彩票手机版| www.876641.com-体彩p3开奖时间| www.975702.com-一定牛彩票被骗| www.hq99.com-好彩客app-| www.53az.com-彩票那天开奖| www.896588.com-哪些彩票出千万大奖| www.ok18.cc-福彩能在手机上买吗| www.088916.com-北京快三和值图表| www.183659.com-福利彩票河北快3| www.250767.com-app快三彩票平台| www.92360.com-一定牛足彩下载| www.381274.com-福彩摇球机-| www.490402.com-淘宝网可以买彩票吗| www.095157.com-幸运鑫彩吧文集| www.165415.com-恒彩平台苹果手机端| www.271162.com-彩28彩票下载| www.kr09.com-足彩新浪爱彩| www.ei82.com-8年玩彩经验| www.893313.com-免费彩票过滤软件| www.974668.com-中华彩票手机版网址| www.co45.com-浙江温州快三走势图| www.zd34.com-带你买彩票是真的吗| www.51qw.com-小班彩虹伞的儿歌| www.812900.com-六彩开奖结果| www.489585.com-七乐彩一等奖号| www.680922.com-香港中彩网1| www.qw73.com-五分快三顺口溜| www.239776.com-王者彩票骗局揭露| www.359312.com-体育彩票去哪| www.448501.com-彩麒麟理财怎么样| www.962791.com-精英彩票网下载| www.17132.cc-京彩e账户下载| www.192632.com-分分快三稳赢策略| www.304942.com-体彩19035结果| www.393633.com-重庆时时彩停止开奖| www.511275.com-彩虹微信名-| www.017802.com-福彩3d幸运码| www.668658.com-彩票冷热怎么分析| www.737256.com-彩票到哪领奖| www.820662.com-快三客服靠什么盈利| www.885405.com-利彩彩票手机app| www.943898.com-大联盟彩票可信吗| www.981489.com-神算彩票专家| www.cp1456.com-福彩快3走势图甘肃| www.33747.cc-彩票买哪种好大奖大| www.001428.com-彩运快三靠谱吗| www.084438.com-快乐彩软件-| www.61vs.com-足球全民彩票| www.yt84.com-长春市体育彩票中心| www.024034.com-六台彩迷宫猪年有景| www.62336.cc-彩票只有体彩福彩吗| www.286068.com-河南幸运彩现场开奖| www.822536.com-福彩金码千禧| www.299958.com-两元彩票-| www.375844.com-北京彩票店转让协议| www.m86.win-有极速时时彩种吗| www.z01.club-八七彩票-| www.954326.com-浙江体彩中心地址| 凤凰彩票www.77801h.com| www.487241.com-天天彩4中奖介绍| www.33648.com-福客来彩票是真是假| www.334272.com-香港快三玩法| www.89wq.com-四平彩票站出兑转让| www.439962.com-美国大学彩票| www.9476.vip-免费彩票统计软件| www.228930.com-广东好彩开奖结果| www.621159.com-聚福彩票成立时间| www.7001.cm-体彩排五的走势图解| www.655168.com-体彩泳池夺金玩法| www.513195.com-狗万彩票-| www.662036.com-熊猫彩票真的假的| www.me35.com-好彩钻石团队| www.96714.com-中彩票怎么花| www.679226.com-聚彩手机网-| www.801971.com-福利彩票小助手官网|