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.4856.top-梦见彩票站-| www.44649.com-佰胜彩票-| www.003429.com-盈彩必赢-| www.092883.com-中国福利彩票生肖| www.177197.com-江苏快三是假的| www.266097.com-河北体彩网开奖结果| www.510101.com-福彩双色奖结果| www.594138.com-彩票分析选号软件| www.677629.com-天天中彩票追号返钱| www.766256.com-湖北体彩快三| www.903577.com-福彩3d投注方法| www.969972.com-排列3乐彩网| www.or74.com-河北福彩快乐3| www.7et.cc-送彩票代表什么| www.75ya.com-胡北体彩11选5| www.2102.xyz-体彩19056期| www.8441.cc-鸿博彩票下载安装| www.63367.cc-足彩19050吧| www.028437.com-微信彩票群二维码| www.112125.com-国外赌场送彩金网址| www.193107.com-乐购28彩票网| www.278148.com-稳赚高频快三娱乐| www.411592.com-ios12原彩没了| www.522507.com-七彩乐开奖结果今天| www.601560.com-中彩网谁会玩| www.678640.com-永利送彩金-| www.766080.com-黑彩可以报警吗| www.901225.com-福彩3d开奖号结果| www.971947.com-湖北万彩票网| www.dk3.com-体育彩票十分钟一次| www.ql89.com-立彩下载链接| www.11ny.com-577彩票com-| www.88ta.com-彩票开奖时间下期| www.3024.top-金祥彩票网址| www.9557.loan-体彩7位数开奖| www.73415.com-彩圣网免费资枓| www.027648.com-易彩网多少钱能提现| www.108643.com-新gg彩票平台| www.183231.com-皇都彩票安卓| www.261468.com-三d刺客论坛研彩网| www.480511.com-三地福彩多彩网| www.564922.com-吉林快三怎么开群| www.639720.com-彩票网站要花多少钱| www.757723.com-500亿彩票网址| www.849235.com-竞猜足彩官网| www.921180.com-买彩票教程-| www.984466.com-彩运网cy088| www.eb93.com-彩票店营业时间| www.xb70.com-308彩票手机版| www.25nl.com-彩票压大小方法| www.0030.com-彩票和佛-| www.6814.vip-266彩票-| www.22130.com-山东体彩论坛手机版| www.68770.com-享彩直播-| www.054954.com-国彩是国家正规的吗| www.137484.com-易彩手机版-| www.218839.com-快发彩票-| www.295808.com-甘肃快三和值图| www.370110.com-龙江风采彩票| www.470896.com-563彩票下载安装| www.560030.com-505彩票下栽| www.632837.com-立彩骗局揭秘| www.707687.com-快三线上娱乐| www.786275.com-大赢家正规彩票| www.863510.com-腾讯平台赛车彩票| www.931362.com-大吉彩票网-| www.989608.com-彩51平台-| www.cp9266.com-豪彩app下载| www.no45.com-中国竟彩网-| www.7ka.com-朋友送的彩票中奖了| www.65ay.com-乐八彩票安卓版| www.0936.me-4场进球彩-| www.9183.biz-手机体育彩票网站| www.49000.cc-足彩单场彩即时比分| www.96459.com-彩票机构有哪些| www.061996.com-彩客站主页-| www.155532.com-66微彩正规吗| www.258093.com-华夏彩票快三| www.333678.cc-买彩票规则介绍| www.405348.com-山东彩礼价格表| www.516705.com-黑彩破解软件| www.586969.com-天天彩骗局揭秘| www.661588.cc-足彩8串8玩法介绍| www.870066.cc-彩票360免费下载| www.971156.com-体彩开奖公告七星彩| www.cp3518.com-广西快三中奖助手| www.mf03.com-江苏福彩快三一定牛| www.k79.com-彩票赚钱的软件下载| www.42gw.com-唯彩双色球预测下载| www.520.me-世界杯彩票玩法介绍| www.4278.biz-三地乐彩论坛| www.9691.biz-特彩吧金彩网| www.81305.com-福彩3d系列三| www.033760.com-七乐彩上市时间| www.129195.com-快三根据什么出号| www.206252.com-快开彩票害死人| www.275819.com-彩票贴吧论坛百度| www.380226.com-彩金套链图片| www.503231.com-谁会做彩票软件| www.571392.com-吉林快三什么计划网| www.642244.com-福彩广告图片| www.751724.com-开心彩票app下载| www.838394.com-千万彩票得主死亡| www.905610.com-快三赔了10万| www.966538.com-爱彩票比分直播| 18W彩票www.391438.com| www.gx85.com-体彩助手app| www.yf88.cc-河南派彩电子走势图| www.18qf.com-彩票大王杨光华书籍| www.817.date-87彩店网页版| www.4600.xyz-中国彩票中奖遇害| www.9844.wang-怎么做彩票app| www.96995.com-体彩6加1-| www.055829.com-怎么玩彩票稳赢| www.142889.com-福彩3d小小鱼图迷| www.214928.com-网上认识的彩票男| www.282243.com-重庆五分彩开彩结果| www.385817.com-九度彩票下载| www.503648.com-娜彩婚纱-| www.568473.com-分分彩四星稳赚平刷| www.639681.com-竞彩改革2019| www.750378.com-豪彩官方注册| www.816011.com-众彩网誉京华| www.882475.com-刷英国五分彩| www.986573.com-699彩票苹果版| www.cai5672.com江苏快三助手下载| www.jk80.com-刷彩是什么| www.ze38.com-怎么拉客户玩彩票| www.18oc.com-体彩开奖时间| www.593.date-福彩3d便民工作室| www.4278.biz-三地乐彩论坛| www.9161.vip-体彩店一般到几点| www.55213.cc-广西时时彩开奖记录| www.95000.cc-高频彩票大数据| www.053139.com-快三一分钟开奖| www.144581.com-体彩走势图路线| www.227529.com-分分快三是不是骗局| www.297025.com-彩票k线的纵向| www.362699.com-彩票缺角-| www.438938.com-够力七星彩奖表长条| www.525013.com-彩票思维推理| www.643308.com-湖北彩前三值| www.720128.com-七星彩四位数玩法| www.789881.com-福彩双色球预测总汇| www.858272.com-1516彩票安装| www.916660.com-最稳定的彩票平台| www.964143.com-快三选号秘诀| 天下彩票www.x34.com| www.bg98.com-全天五分彩是骗局吗| www.qo99.com-吉林快三开奖视频网| www.06fr.com-彩铅调肉色-| www.65ng.com-杭州福彩中心电话| www.966.xyz-梦秘解图七星彩梦册| www.7339.in-彩虹无人机产地| www.18358.com-彩票王成周视频| www.55316.cc-中国体育彩票小程序| www.94778.com-比较正规的彩票平台| www.041360.com-博发彩票-| www.157037.com-易彩网彩票是真的吗| www.234112.com-安徽体彩手机在线| www.297553.com-御彩轩计划软件| www.359776.com-凤凰彩票平台怎么样| www.431274.com-选6型彩票缩水软件| www.515576.com-中发彩票正规吗|