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天

知道了
彩39彩票安卓 www.005581.com-彩1app在哪下载| www.494118.com-今天福彩3d彩涂| www.93gj.cc-幸运28彩票游戏| www.790076.com-西宁福彩店-| www.900084.com-51彩票的网址| www.987123.com-大连福彩快三| www.ac82.com-五分⑥和彩开奖网站| www.315087.com-彩虹6号墨冰多少钱| www.410470.com-唯彩看球历史版本| www.69288.cc-中国体育胜负彩| www.6070.vip-奇门测彩票方法研究| www.23456.cc-河北快三高手推荐| www.488565.com-全民乐彩票注册| www.566761.com-快速彩票软件排行榜| www.415448.com-盈彩线上娱乐入口| www.292342.com-彩神uu-| www.369834.com-竞彩封盘早-| www.466898.com-七乐彩卖到晚上几点| www.564311.com-彩福快三是官方的吗| www.636885.com-儿歌彩虹-| www.711983.com-高价彩礼-| www.793130.com-福利彩票如何看中奖| www.872603.com-湖南体彩赛车官网| www.947829.com-竞猜彩票实体店被禁| 金牌彩票www.919586.com| www.pa63.com-快购彩票网站| www.9025.vip-3d乐彩关注码| www.816993.com-今天晚上开什么彩票| www.900804.com-河北福彩排列7开奖| www.984614.com-广州福彩站主登录| www.ek16.com-布衣彩吧图库| www.567808.com-一张彩票的利润| www.135959.com-体彩篮球竞猜玩法| www.273211.com-福彩文化理念| www.368012.com-浙江体彩六加一规则| 亿彩堂www.87668l.com| www.xf06.com-河北快三开结果| www.81mw.com-彩神通资料-| www.2282.vip-福彩快三坑哭人| www.01477.com-彩票抢红包平台| www.53941.com-竞彩提成-| www.327651.com-快三长龙记录| www.499011.com-代打彩票工资日结| www.646322.com-福彩双色球故事中奖| www.745559.com-六禾彩开奖结果香港| www.827002.com-赚钱彩票送彩金| www.911613.com-三分快三走势怎么看| 500万彩票www.w984.com| www.40776.com-一号店彩票登录| www.50pw.com-今天七星彩开公告| www.4123.cm-彩虹无人机价格| www.16393.cc-竞彩足球计算机| www.489709.com-足彩比分直播雪缘| www.584513.com-腾讯天天中彩票| www.661187.com-cp128彩票-| www.790080.com-西宁体彩兑奖地址| www.868732.com-凤彩网七星彩预测| www.941282.com-彩票网站回单套利| www.988915.com-家彩网千禧开机号| www.eu30.com-手机版彩票助赢| www.we15.com-贵州体育彩票快三| www.43wu.com-遵义好彩香烟价格| www.381617.com-昨晚福利彩票中奖号| www.506078.com-快三加奖2017| www.581530.com-快三软件计划app| www.661187.com-cp128彩票-| www.757458.com-团队计划购彩| www.828367.com-福彩自助投注机代理| www.894862.com-兼职代打彩票| www.954341.com-彩28彩票下载安装| 博亿彩票www.669by.com| www.0471.live-体彩走试图-| www.19820.com-手机制作彩票app| www.120763.com-竞彩兑奖有效期| www.62xl.com-信阳78人合买彩票| www.3405.cm-彩虹翼支付官方| www.17497.com-彩票挂机靠什么赚钱| www.72897.com-深圳体彩中心app| www.027360.com-一分彩票-| www.111271.com-彩民福地app| www.187378.com-下载时时彩投注平台| www.700348.com-时时彩私彩如何破解| www.809690.com-多彩网3d走势图| www.972596.com-触屏彩客网-| www.9ve.com-福彩3d断组规律| www.3119.cm-彩票世界杯专家预测| www.35375.com-福彩作假视频曝光| www.041234.com-足球足彩-| www.165283.com-什么是68彩票| www.391752.com-竞彩7场24关| www.526365.cc-足彩培率-| www.596121.com-彩票算法规律| www.659934.com-顺盈彩票有多长历史| www.751726.com-世界杯的足彩| www.900411.com-亿元大乐透彩票图片| www.984832.com-幸运选号彩票新浪| www.47we.com-福彩体彩y销售网点| www.0084.in-给彩票群取个名字| www.8674.pw-91彩票计划方案| www.39276.cc-分分彩票软件下载| www.wn33.com-235彩票平台| www.0092.cn-形容彩票句子| www.16601.com-彩票可以跨店兑奖| www.175809.com-彩神争8谁与争锋| www.268461.com-彩神ⅱ8-| www.5428.vip-足彩40期九场奖金| www.6tc.com-竞彩分分彩-| www.9488.in-彩票选号器软件| www.56839.cc-彩乐网资料大全| www.008670.com-体彩第19029期| www.521406.com-紫微预测彩票| www.721009.com-彩票七乐彩2元网| www.860499.com-武汉竞猜快三| www.985594.com-28彩票官网-| www.060931.com-天干地支如何彩票| www.804845.com-台湾彩虹旗论坛网址| www.941418.com-中福时时彩开奖结果| www.hw28.com-体育彩票管理中心| www.49nv.com-生日彩票自动选号| www.1634.vip-博彩游戏注册送彩金| www.004925.com-彩神vll软件| www.9071.cm-环彩彩票进不去| www.47158.com-阳光彩票是骗人的吗| www.545563.com-彩票销售点怎么申请| www.732259.com-国家官方彩票有几种| www.04ex.com-v8彩票注册-| www.4283.biz-双彩论坛网蓬莱红帽| www.95562.com-体育彩票分配比例| www.257815.com-038彩票合法吗| www.021.name-彩吧‖登录平台| www.8428.top-星彩代挂-| www.48499.cc-陆慧明竞彩猫app| www.023826.com-陕西福彩快乐十分钟| www.2862.vip-福彩3a字谜画谜| www.19161.com-三地福彩中心开机号| www.66877.com-双色球彩票扫码查奖| www.587795.com-6合万彩1-| www.647675.com-合法的彩票网有哪些| www.994059.com-大发分分彩稳赚技巧| www.no17.com-竞彩计算器500| www.0887.loan-好球彩票官方网站| www.67701.com-褔彩3d开将结果| www.120343.com-新彩票网站-| www.230963.com-阿里彩票平台可靠吗| www.381528.com-礼拜五彩票开什么奖| www.578869.com-彩票双机店-| www.735385.com-网赌玩高频彩违法吗| www.925933.com-500彩票预测| 福彩www.16878s.com| www.uh84.com-360彩票是合法的| www.787527.com-篮球比赛竞彩网| www.974695.com-七星彩精选论坛| www.oi06.com-长春市福彩中心| www.2219.net-福彩3d短租-| www.559418.com-牛人彩票网站| www.806002.com-风云计划中华彩票| www.883083.com-一号彩票输惨了| www.957576.com-时时彩都是假| 万历彩票www.77114n.com| www.gt16.com-新彩网-| www.c02.top-中国竞彩网比分直墦| www.976159.com-河南省的彩礼多少钱| www.o05.xyz-玩彩方法-| www.36gk.com-一分快三软件制作|