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.717234.com-排三分析预测彩吧| www.832827.com-黑彩快3下载| www.900715.com-贵州爱彩乐-| www.964797.com-体彩e球彩开奖公告| www.cp3030.com-彩票导师靠谱吗| www.vi93.com-福利彩票贴吧| www.16kb.cc-福利彩票3d上期| www.4439.cc-举报亿彩彩票| www.37336.cc-皇室彩票合法吗| 梦想彩票www.33112d.com| www.ix76.com-极速快三开奖信息| www.4ci.cc-一同事每天必买彩票| www.75le.com-七乐彩25号开奖| www.2667.wang-下载旧版本九九彩票| www.9167.in-87彩票官网下载| www.50593.com-博彩评级手机数码| www.010166.com-告诉你福利彩票骗局| www.309006.com-南洋彩票-| www.462592.com-福彩500万-| www.583138.com-彩票网2元-| www.663488.com-彩券公司不出四肖| www.083760.com-3d智博谈彩-| www.217560.com-k彩天民福地| www.305973.com-七星彩预测海报| www.397839.com-足彩比分直播预测| www.42pt.com-彩票现场直播| www.15dx.com-豪华彩票店装修| www.092196.com-体彩买彩票截止几点| www.203619.com-内苎快三走势图| www.277614.com-十分快三玩法| www.730385.com-599彩票数据中心| www.825221.com-盈盈彩-| www.899669.com-c?81彩-| www.968954.com-彩神512i喷绘机| www.516205.com-用矩阵计算彩票| www.646601.com-彩票开奖提前| www.758777.com-彩薇花化妆品评价| www.850585.com-有玩大发快三的吗| www.947175.com-彩票开奖双色球开奖| 500彩票www.607252.com| www.097938.com-下载本地万彩吧| www.246278.com-上海福彩新快3| www.73385.com-体彩排三开机试机号| www.034266.com-快三猜单双技巧| www.129129.com-彩票网极速-| www.212142.com-福彩店押金好退吗| www.295666.com-彩票app提现失败| www.371843.com-网易彩票分分彩| www.86jw.com-必发彩票bf-| www.3669.top-98彩票官方下载| 彩乐乐www.cll168.com| www.338627.com-时彩族怎么打不开| www.239315.com-万豪福彩下载安装| www.19yp.com-体彩排列3彩票| www.12579.com-爱乐透彩票历史版本| www.26391.cc-彩票的税率是多少钱| www.88827.com-333彩票下载软件| www.046545.com-盈彩网客户端下载| www.018910.com-彩富网最快报码室| www.137480.com-竞彩足球任九| www.93556.com-河南体彩高频走势图| www.162326.com-下彩app客户端| www.228633.com-彩色纸箱设备| www.17978.com-幸运彩兼职是真的吗| www.365978.cc-重播更多精彩视频| www.503530.com-东森彩票平台安全吗| www.576543.com-彩02彩票平台正规| www.647626.com-大富翁i8彩票| www.849808.com-比特币分分彩结果| www.922134.com-彩票365苹果版| www.972755.com-小学彩铅画-| www.cp3778.com-幸运快三是不是骗局| www.lx02.com-彩之家下载安装| www.f71.org-f彩网打单骗局| www.41wh.com-幸运之彩是骗局吗| www.627.gg-彩票佣金-| www.4319.biz-f彩网是假的吗| www.529911.com-赢彩彩票与你同行| www.791784.com-马来三分彩哪里开的| www.866649.com-今天看彩票中奖号| www.921068.com-双色球命中中彩专栏| www.992468.com-江苏体彩竞彩足球| www.dv33.com-彩票五星乐彩正规吗| www.961103.com-三分快三精准计划网| 多乐彩票www.677474.com| www.258855.com-竞彩单场推荐| www.356164.com-彩票大乐透奖金分配| www.441958.com-体彩押金退还流程| www.539736.com-大地彩票安卓版| www.611666.com-雨后彩虹歌词周杰伦| www.683311.com-七星彩加急版海口网| www.760711.com-台湾时时彩助赢软件| www.822222.cc-彩民彩票如何解绑| www.885769.com-体彩兑奖后多久到账| www.963284.com-彩色水磨石地坪价格| 超级彩票www.811675.com| www.45898.com-qq赛车彩票-| www.015890.com-幸运彩票提现| www.118092.com-福建体育彩票走势| www.193795.com-湖北今天快三结果| www.260328.com-彩票机赌博-| www.326563.com-安然七星彩专家总汇| www.363851.com-快三解锁软件| www.455557.com-彩票中奖后的故事| www.543265.com-福彩双旦毒胆| www.622091.com-青哇彩8时万| www.274277.com-分分快三如何破解| www.up30.com-体彩快三怎么玩| www.61eq.com-七乐彩今天出号| www.2302.vip-微彩彩票怎么充值| www.6mf.com-168彩票注册网址| www.894853.com-高频彩票为什么调整| www.983461.com-计划员彩票-| www.am02.cc-下载河北福彩快三| www.0ue.com-儿歌彩虹的约定串词| www.120034.com-广西快三预测群| www.240900.com-快三彩票奖金是多少| www.317979.com-十字彩犯法吗| www.79iq.com-百彩网综合资料| www.2364.biz-查七星彩-| www.yc71.com-彩票时时彩买龙虎| www.66813.cc-彩票兑奖处-| www.7123.cc-建盏的七彩能擦掉吗| 幸运彩票www.444037.com| www.629993.com-福彩数学3-| www.631229.com-福彩3d怎么看两码| 600万彩票www.187517.com| www.63br.com-福彩3d校长预测| www.388062.com-华彩咨询有多少人| www.837701.com-彩票之家开奖结果| 彩票坊www.022q.cc| www.a11.club-新浪爱彩手机版| www.108483.com-七星彩38期开奖号| www.op28.com-江苏老快三最大遗漏| www.626833.com-信发彩票app| www.726269.com-河南体彩怎样兑奖| www.821515.com-福彩网投靠谱吗| www.913353.com-即时比分彩客网| www.982873.com-彩票资料共享大全| www.cr66.com-彩票争霸-| www.x39.cc-时时彩走势图下载| 大赢家彩票平台www.226705.com| www.971233.com-彩c16app-| www.31155.cc-彩票专业分析管理器| www.127807.com-盛大彩虹岛手游内测| www.803909.com-三亚体彩飞鱼| www.928508.com-俄罗斯彩票大奖号码| www.93qp.cc-迷彩外套配什么颜色| www.055152.com-福彩体彩正版藏机图| www.444131.com-精彩网页设计赏析| www.580430.com-彩票数字在多少| www.678716.com-国彩彩票平台| www.791627.com-福彩直播视频| www.884061.com-乐彩网10-| www.3668.com-∵昨天彩票开奖结果| www.024451.com-内蒙古福彩aqq| www.43uw.com-挂彩了什么意思| www.1553.me-福彩3d杀码最精确| www.9007.online福彩刮刮卡活动方案| www.38375.com-k彩进入网站| www.63xc.com-彩票网能提现不| www.3879.in-彩金黄金哪个好| www.29662.cc-七彩票-| www.98149.com-时时彩三中三计划|