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.008283.com-19004期胜负彩| www.237621.com-足彩比分直播5oo| www.366522.com-彩票五行属于什么命| www.549590.com-足彩欧冠有几种玩法| www.673231.com-七星彩最大奖| www.943228.com-彩票中奖内幕秘密| QQ彩票www.89894j.com| www.792985.com-打击私彩赌博| www.907735.com-吉林市快三跨度表| www.976251.com-七乐彩要选蓝| www.jj08.com-加盟彩票店赚钱吗| www.m44.biz-体彩可以买双色球么| www.mc64.com-彩票送28彩金免费| www.866428.com-搜狐竞彩足球| www.676266.com-体彩七位数几点截止| www.938326.com-双赢彩票平台登录| www.379606.com-中彩票是什么感觉| www.579496.com-雪缘足彩山分直播| www.855751.com-七乐彩投注查询表| www.981708.com-吉利彩票网投可靠吗| www.495933.com-盈禾博彩-| www.ln26.com-彩票app赠彩金| www.17bu.cc-彩票技巧书籍大全| www.535740.com-买彩票需要几个数字| www.8512.cm-乐艺彩票997软件| www.752790.com-注册送18元彩票| www.900648.com-玩彩老头-| www.972884.com-陈赫中奖彩票被调| www.gs6.cc-安徽快三靠谱吗| www.sb16.com-新浪时时彩开奖号码| www.27642.com-舟山飞鱼彩票怎么玩| www.82468.com-香港快三全天计划| www.083676.com-网上博彩是违法的吗| www.003478.com-柬埔寨打工彩票推广| www.826086.com-933彩票安卓| www.917058.com-彩铅画图片卡通可爱| www.29ga.com-大菠萝彩票软件| www.3295.cn-色子彩票-| www.058260.com-竞彩米斗跟单下载| www.51320.com-福彩购彩软件可靠吗| www.355046.com-彩票怎么看怎么买| www.513041.com-时时彩五星选号| www.644342.com-足彩19019-| www.733465.com-体彩时时彩走势图| www.4285.com-京东快彩28-| www.mq12.com-重庆时时彩技巧稳赚| www.02ho.com-廊坊福利彩票中心| www.88kr.com-福彩机器人彩票机| www.3311.live-彩票有没中奖| www.234154.com-安徽福彩中心| www.798348.com-网赢彩票-| www.901206.com-体彩试机号金码关注| www.991589.com-彩票vip下载| www.bs43.com-福到彩票福建快三| www.yh53.cc-北京快三推荐号今日| www.16wq.com-竞彩分析师招聘汇总| www.94zm.com-彩礼全国-| www.2975.wang-日本彩票怎么查结果| www.236.me-三分重庆时时彩计划| www.1291.cn-福彩快乐三一天开奖| www.207779.com-彩1官网下载| www.581920.com-48cfcc彩富网| www.711266.com-澳客竞彩比分直播| www.796682.com-66彩票app-| www.873712.com-彩12下载-| www.cp262.com-吉林快三开奖号码| www.mf54.com-好彩官方下载| www.o88.in-体育彩票买4个号| www.187288.com-北京时时彩app| www.378796.com-3d双彩论坛专区| www.787903.com-竟彩混合投注| www.882019.cc-87彩票店靠谱吗| www.963734.com-福彩网是什么网站| 福利彩票www.846631.com| www.qg45.com-好彩1生肖码| www.11257.cc-中国体彩网四川| www.276644.com-江苏快3快彩乐开奖| www.418502.com-时时彩哪种玩法稳| www.563788.com-香港中彩堂安装| www.682112.com-吉林快三出号规律| www.285236.com-大发时时彩软件计划| www.464468.com-古建彩绘纹样草图| www.610377.com-竞彩足球胜平规则| www.011693.com-昨晚福彩开什么| www.170041.com-快三彩票app下载| www.956672.com-彩票打错了要赔偿吗| 大赢家彩票平台www.373553.com| www.255350.com-大发快三500彩票| www.9998.vip-彩色压模混凝土厂家| www.75541.com-国外365彩票网站| www.054693.com-竞彩分析预测| www.3547.com-83彩官网下载| www.75457.com-彩票是否是骗局吗| www.072887.com-六亿彩票下载| www.151645.com-比较正规的彩票软件| www.876263.com-约彩彩票app| www.949770.com-8炫彩即开型怎么玩| 大赢家彩票平台www.068673.com| www.mm48.com-时时彩稳定盈利玩法| www.07pn.com-彩票码的资料| www.120948.com-快乐彩胆拖速算表| www.217128.com-快三一个号码怎么组| www.1872.wang-q彩注册6位邀请码| www.65567.cc-体彩快三11选5| www.678788.com-刷彩网赚是怎么回事| www.784105.com-福乐彩是什么| www.866613.com-昨晚彩票出什么数| www.931988.com-彩票遗传数值| www.982182.com-3d字谜总汇新彩网| www.hp56.com-北京福彩pk拾| www.l49.club-福利彩票趋势图| www.27123.com-竞彩猫合买-| www.072176.com-彩票实体店-| www.222212.com-快彩十一选五助手| www.9953.com-彩礼退还-| www.75338.cc-上海时时乐彩票介绍| www.050316.com-彩票自助售票机| www.118668.com-时时彩大群-| www.196832.com-七乐彩中奖规则| www.280303.com-彩乐乐推荐-| www.360818.com-官方高频彩开奖号码| www.949152.com-电脑彩屏怎么办| 天天中www.33ttz.com| www.gf68.com-体彩七星彩玩法| www.xj29.cc-好彩客app下载| www.cp9388.com-快三单双关系加减一| www.879743.com-彩票计划团队大全| www.990717.com-竞彩投注计划表| www.ct41.com-优信彩票在线| www.tn41.com-彩票七乐彩开奖结果| www.6sm.com-北京体彩怎样下单| www.83ik.com-腾讯十分彩app| www.324900.com-发达彩票是正规的吗| www.395576.com-昨晚的3d的彩票| www.869019.com-彩票十分钟一期| www.979416.com-好彩香烟铁盒装| www.123.cm-旧版手机彩客网| www.55547.com-买福彩快三-| www.019142.com-49彩票苹果版| www.3748.com-辽宁省福利彩票3d| www.624822.com-七乐彩开奖直播新浪| www.723597.com-彩票指南报纸16页| www.803489.com-彩票专家计划| www.903815.com-彩票106手机版| www.979403.com-网络彩票买大小单双| www.238009.com-854彩票app-| www.336938.com-微博世界杯彩票| www.125763.com-众乐彩票手机版下载| www.239296.com-快三开奖人工控制吗| www.tr75.com-贵州福彩三地推荐| www.75nr.com-足彩2场单场固定| www.583095.com-彩票爱乐透-| www.646333.com-足彩博冷-| www.746359.com-多赢彩票手机版| www.wb37.com-体彩任选三开奖结果| www.056160.com-彩票黄金分割趋势| www.036530.com-k彩彩民福地登录| www.186500.com-江苏快3彩票软件| www.731882.com-精彩十分中奖彩票| www.813794.com-中国体育彩票微信号| www.878012.com-体彩p3中奖号码| www.978764.com-500万彩票网投注| www.cp733.com-全国彩票开奖结果| www.39581.cc-九歌彩票手机苹果版|