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.237128.com-甘肃快三微信群| www.571789.com-彩虹六号围攻新角色| www.755093.com-福彩3d北斗推荐| www.894567.cc-31彩票走势图| www.wg26.com-下载天天彩票最新版| www.71em.com-广东福彩3d开奖| www.8469.net-北京彩票店转让信息| www.028348.com-博友彩在哪里下载| www.6648.cm-福彩双彩网-| www.72269.cc-彩票打印不一样| www.101404.com-立彩是什么东西| www.190633.com-山东体彩扑克3| www.282195.com-有没有彩票主播| www.459261.com-福彩排三大小走势图| www.567347.com-天津市福彩中心地址| www.643511.com-2分彩计划-| www.785096.com-福彩官员贪污| www.912806.com-中华彩票网合法吗| www.43ny.com-表现出彩是什么意思| www.10cx.com-天网诈骗彩票| www.387158.com-网上幸运彩犯法吗| www.g99.top-彩宝app赌博| www.iz82.com-中国福彩双色球预测| www.900693.com-c777彩票-| www.185580.com-体育彩票的宗旨是| www.365865.cc-七星彩参考码| www.786455.com-大赢家快三-| www.7731.love-黑龙江福彩时时彩| www.8828.loan-彩票白菜发布论坛| www.080205.com-赌博彩票机-| www.238526.com-广西福利彩票官网| www.408782.com-体育足彩中了| www.9535.xyz-林疑彩凤来的意思| www.509394.cc-排例五走势图彩宝贝| www.927098.com-天天彩1-| www.pk23.com-快三宝典下载| www.1840.vip-天天彩票论坛看一看| www.95374.com-福利彩票心得体会| www.137710.com-七星彩电脑版| www.273036.com-福彩发行宗旨| www.416921.com-最准49彩计划| www.611551.com-家彩网胆码预测独胆| www.799856.com-qq彩票安全可靠吗| www.949369.com-百盈彩票官网| www.18253.cc-福彩手机投注app| www.79151.com-足彩预测单场专家| www.127286.com-彩虹岛w国服在哪| www.257369.com-甘肃快三奖金规则| www.367630.com-体彩返奖率那么低| www.505577.com-365天天彩票合法| www.606588.com-互联网还能买彩票吗| www.707656.com-福利彩票线上选号| www.828698.com-彩票赊销案例| www.981994.com-辉腾团队彩票| www.mb62.com-好运彩快三下载| www.058.date-众彩网欧阳宵| www.45008.cc-703彩票-| www.025717.com-七乐彩开奖今天| www.794632.com-谁在九州彩票赢过钱| www.937012.com-鸿博彩票计划| www.pr85.com-98彩是正规平台吗| www.529022.com-网上玩彩票输了钱| 亿发彩票www.870933.com| www.158198.com-北京福彩pk拾玩法| www.566365.com-福彩体彩在一起| www.613093.com-新加坡乐和彩公司| www.885753.com-55彩票下载-| www.990423.com-下载彩票软件可靠吗| www.34dp.com-七星彩千万大奖| www.86362.cc-利彩彩吧助手| www.438222.cc-体彩排五预测论坛| www.604962.com-中澳彩票是合法吗| www.757348.com-彩票长龙最长开出| www.977945.com-彩钢瓦围挡安装方法| www.130706.com-福彩致富团队| www.yx22.com-极速快三开奖网页| www.869118.com-七星彩顺口溜| www.242681.com-中彩网字谜-| www.238.net-购买足球彩票| www.488756.com-竟彩澳客推荐新浪| www.695392.com-足彩投注比例查询| www.472318.com-关于彩票小说| 华人彩票www.040438.com| www.208118.com-彩票开奖μ-| www.840427.com-北京结婚彩礼| www.446755.com-全民赢彩票压熊猫| www.858104.com-福利彩票几点关机| www.489.win-分分彩5星漏洞教程| www.16253.cc-新浪彩票基本走势图| www.540076.com-八号彩票论坛| www.907167.com-福利彩票有几位数字| www.042687.com-浙江省体育彩票官网| www.862727.com-上海天天彩选4| www.010177.com-乐彩欢迎你-| www.6970.cn-时时彩四星杀号方法| www.68871.cc-买彩票选号的规则| www.032813.com-开奖派彩助手| www.120239.com-澳门五分彩开奖结果| www.196701.com-彩票快三分析软件| www.267259.com-胜负彩500网| www.345754.com-九万彩票平台登录| www.424279.com-星彩无慘-| www.520491.com-福彩双色球怎么中法| www.619530.com-福彩3d术语解读| www.731949.com-8k易彩网址-| www.874316.com-福彩公众号-| 福彩www.86267b.com| www.yv91.com-快三出完豹子出什么| www.87584.com-体育彩票刮刮乐种类| www.202526.com-贵州福利彩票招聘| www.288319.com-爱乐彩江苏11选五| www.369545.com-中国彩吧全图| www.020799.com-京东彩票下载| www.8235.loan-江西快三预测一定牛| www.71500.com-香港幸运彩-| www.103416.com-丰彩中奖率高吗| www.227871.com-福彩网下载-| www.337035.com-山东体彩网首页| www.472996.com-173平安彩票| www.763736.com-足彩加软件-| www.885412.com-彩票一购彩大厅| www.987750.com-仲彩平台加入| www.mo19.com-2019送彩金网站| www.07sn.com-体彩p3杀号定胆| www.613893.com-福彩彩票sd走势图| www.871210.com-豹赢彩票真假| www.388124.com-广州福彩网开奖结果| www.272798.com-责任彩票的理念| www.344508.com-红彩哥哥直播作品| www.440490.com-江苏快三有赢的吗| www.531864.com-彩票大神微信| www.595880.com-彩票店中奖横幅咋写| www.359895.com-福彩3d断组| www.471.cc-手机500万彩票网| www.348283.com-台湾彩虹频道| www.411901.com-彩票那几天开奖| www.505438.com-彩票该玩吗-| www.518276.com-彩球游戏教案| www.70795.com-728彩票安卓下载| www.518872.com-彩票字谜3d-| www.637466.com-彩虹六号需要加速器| www.743265.com-酷彩客户端-| www.856258.com-体彩都有什么玩法| www.944342.com-大联盟彩票取款失败| 亿彩堂www.87668l.com| www.nm26.com-七星彩随机选号器| www.68wc.com-分分彩必赚投注方法| www.988821.com-彩票一等奖交多少税| www.ig76.com-彩票快三倍投技巧| www.n11.wang-福彩陕西快乐十分| www.931212.com-李永乐关于彩票| www.738718.com-福彩快三输了二十万| www.98oq.com-买黑彩票-| www.5447.com-彩虹六号手游叫什么| www.13459.com-360竞猜足彩| www.74513.com-自创彩票加减法| www.038758.com-彩票图怎么看| www.108328.com-足彩竞猜最新结果| www.542860.cc-梦想彩票网可靠吗| www.62dz.com-猎豹团队时时彩计划| www.866057.com-五星平台彩票| www.3073.org-七彩星txt微盘| www.31826.com-彩票3分快3-| www.366630.com-彩铅调肉色-|