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天

知道了
新2彩是不是黑网址 www.725278.com-珐琅彩水杯-| www.898803.com-足球彩票推荐软件| www.974160.com-网彩什么时候恢复| www.63tt.cc-上金科技彩票源码| www.4580.in-中国福利彩票怎样买| www.37865.cc-新版本彩票77| www.001966.com-中国七星彩在线| www.087601.com-云彩彩票app下载| www.206111.cc-彩票网投-| www.292217.com-体彩直选3开奖| www.378449.com-幸运彩苹果系统下载| www.609203.com-今天赛马结果及派彩| www.696280.com-0k彩票下载-| www.799856.com-qq彩票安全可靠吗| www.906262.com-5分快3彩票-| www.990000.com-中国彩吧一更懂彩| www.u54.club-今日圣彩字谜| www.69du.com-皇冠彩票是正规的么| www.3048.com-体彩布衣图-| www.20126.com-手机购彩app制作| www.63816.cc-浙江省爱乐彩| www.078950.com-彩牛彩票安卓| www.162792.com-甘肃快三豹子| www.293590.com-九千万彩票-| www.377992.com-体彩装修补贴标准| www.537009.com-网名彩虹-| www.635790.com-宝乐彩票app下载| www.745625.com-彩61主页-| www.871244.com-80彩票软件-| www.980599.cc-百盈彩票是真的吗| www.zl3.cc-360彩票全国开奖| www.uw22.com-网上快三有技巧么| www.37pn.com-太康县结婚彩礼多少| www.2187.wang-永利彩票的真假| www.9356.cm-703彩票官方网站| www.78955.cc-福彩3d开奖号漏洞| www.052185.com-谁有彩票合买| www.177452.com-分分快三计划网| www.277255.com-广西快三一定牛网站| www.423051.com-体彩p3图谜图库| www.534300.com-网络彩票有正规的吗| www.657695.com-湖北福彩快三百宝彩| www.762212.com-竞彩足球投注下载| www.878617.cc-上饶体彩领奖在哪里| www.985215.com-中国彩软件是真的吗| www.cg19.com-吉林长春快三| www.ub47.com-快三中几个数有奖| www.32jy.com-3d走势彩吧助手| www.1935.win-信阳体育彩票站| www.8334.xyz-青海快三介绍| www.81183.com-手游彩下载-| www.038586.com-福彩二分快三| www.235455.com-彩票3d微信讨论群| www.330950.com-彩81彩票资料| www.414192.com-精彩精的意思| www.524342.com-香港大公报一码彩经| www.671480.com-下载彩宝网-| www.754930.com-快三三不同技巧| www.879749.com-体彩新型终端机| www.984927.com-788彩票网-| www.cp53.com-下载快三彩票| www.tz97.com-彩票专业术语对话| www.25ba.com-福彩彩店几点开门| www.1100.pw-彩票直播长龙| www.9273.cn-乐彩站是真的吗| www.55497.com-大小彩票平台| www.037709.com-福彩过滤软件下载| www.163014.com-大快三三同号技巧| www.265686.com-安徽快三彩票店| www.374588.com-今天篮彩预测推荐| www.530082.com-七星彩铁公鸡下载| www.650978.com-简单唯美的水彩画| www.749001.com-时时彩平台不给提款| www.814945.com-球彩体育-| www.890806.com-彩票在线试玩| www.997403.com-福彩乐透app| www.oo2.com-江苏快三预测与推荐| www.si83.com-彩票幸运农场技巧| www.14ae.com-中国彩富足彩网| www.80fe.com-百宝福彩青海快三| www.1979.biz-盐城彩莲船-| www.081710.com-彩票独胆怎么求| www.185898.com-博众时时彩官方网| www.281128.com-非法彩票定罪| www.453999.com-复合彩光祛斑| www.898805.com-买彩票的软件哪个好| www.996800.cc-北京彩票中心地址| www.da64.com-神彩xapp-| www.zf97.com-甘肃福利彩票网网址| www.25ba.com-福彩彩店几点开门| www.0334.vip-江西福彩大奖兑奖| www.6594.cn-紫微彩票占卜| www.15288.com-彩票科学倍投方法| www.55971.cc-多彩彩票app下载| www.98156.com-今天福彩3b试机号| www.062997.com-福彩网点申请和利润| www.188394.com-安徽快三规则| www.256716.com-掌中彩安全吗| www.324244.com-马来西亚大马彩玩法| www.384277.com-体育彩票宣传口号| www.550907.com-18个人合买彩票| www.639550.com-竞彩足球加盟费| www.721730.com-豪彩网-| www.791431.com-3d福彩图谜字迷| www.864340.com-235彩票软件| www.925326.com-彩票平台招代理| www.979121.com-好彩三奖金是多少| www.vb45.com-香港权威彩神网网址| www.05sa.com-福利彩票33期色| www.69sx.com-体彩乐透规则| www.0604.net-福彩小财神彩票论坛| www.8302.top-深圳福利彩票机转让| www.27798.com-3cp官方彩票| www.68481.com-上海11选5一k彩| www.039901.com-排三走势图乐彩网| www.123182.com-重庆时时彩易算| www.189062.com-网彩平台-| www.254486.com-福彩快三内蒙| www.319517.com-星彩娱乐-| www.382128.com-彩仙阁软件app| www.539423.com-彩票是什么时候发行| www.617701.com-长春彩票一等奖| www.681626.com-如何用手机买彩票| www.753419.com-12彩票网-| www.855701.com-奖金最多的彩票| www.913702.com-大发彩票是违法| www.970051.com-天天乐彩官网首页| www.cp9329.com-河北快三形态一定牛| www.ly43.com-幸运中彩票快3| www.e62.net-体彩网首页电脑版| www.26sj.com-彩经彩票邀请码| www.939.cm-星彩叫夏侯姬妈| www.4579.biz-买彩票去实体店| www.9355.club-彩票官员查处几十位| www.55210.com-天津时时彩开奖现场| www.93634.com-彩泥相框画-| www.045553.com-体彩福彩申请流程| www.139542.com-凤彩网就是赌博吧| www.207302.com-app彩票软件大全| www.269128.com-珠江彩票官网| www.365745.cc-足球竟彩网比分直播| www.443653.com-七星彩票开个奖结果| www.525360.com-快三贵阳彩票走势图| www.54vq.com-福彩3d3d村杀号| www.096702.com-中彩网专家推荐| www.847118.com-竞彩盈亏的区别| www.3132.cc-七星彩中奖计算器| www.8156.org-彩之网实时统计数据| www.23569.com-红旗彩票官方网站| www.60564.com-云南体彩十一选五开| www.039307.com-发彩彩票-| www.117775.com-竞彩普及日强胆推荐| www.169286.com-吉林快三下载开奖| www.260064.com-福彩体彩软件| www.323048.com-巴西五分彩开奖结果| www.383181.com-26号体彩-| www.514277.com-甘肃快三2019| www.573093.com-重庆体彩地址| www.631015.com-好彩头上市-| www.688465.com-苏会文彩票专栏| www.753622.com-分分中彩票官网| www.878292.com-福彩19年073期| www.956576.com-足球彩票手机软件| 惠民彩票www.hm5333.com|