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.494888.com-德州彩票站转让信息| www.639834.com-东方集团彩票游戏| www.783708.com-七乐彩号码分布图| www.878101.com-福彩3d大奖故事| www.984461.com-彩运网222-| www.gc51.com-3d牛彩字迷总汇| www.a97.com-游戏《彩虹伞》教案| www.41ng.com-体彩排到三开奘结果| www.0068.loan-彩票分什么类型| www.9143.xyz-彩票金七乐走势图| www.55566.cc-彩虹伞游戏背景音乐| www.009735.com-手机彩票送28| www.093281.com-北京中彩快印| www.171377.com-休肓彩票开奖| www.302498.com-中彩手机彩票可信| www.856396.com-彩票12辽宁-| www.947022.com-全天重庆彩计划五星| www.cp5787.com-手机买彩票怎么买| www.qe04.com-彩6下载ios-| www.16pg.com-南粤好彩3-| www.413.me-乐米彩票官网查封| www.4866.com-足球彩票大数据分析| www.08219.com-足彩专业术语详解| www.58012.com-爱彩人基本走势图| www.110852.com-1分钟1开的彩票| www.188671.com-什么叫彩票屠龙计划| www.269357.com-广西快三害人输惨了| www.397610.com-云南快三一定牛| www.539984.com-姜丽的花式快三| www.636581.com-彩虹6号冷知识| www.731212.com-金誉彩票网址| www.813663.com-宁夏彩票最大奖| www.896072.com-福利彩票内部数据库| www.968039.com-福彩违法事件| www.ft07.com-百盈快三合法吗| www.yv36.com-新2彩票论坛正版| www.28ep.com-爱彩乐遗漏号| www.0350.net-被人邀请手机买彩票| www.7344.xyz-竞彩公益金-| www.27832.cc-时时彩高手在民间| www.77678.cc-彩仙阁官网-| www.036382.com-奥客竞彩足球直播| www.165711.com-中彩提现快吗| www.261290.com-宁夏快三今日开奖| www.359752.com-三亚抓私彩-| www.456097.com-彩虹六号地图小技巧| www.554273.com-金彩网原装正版料| www.628037.com-一般彩票是几位数字| www.702936.com-兼职时时彩是真的吗| www.785682.com-xr原彩有什么用| www.866690.cc-陇彩宝app下载| www.938712.com-双赢彩票诈骗吗| C9999www.318548.com| www.dk63.com-体育彩票七星彩预测| www.wv06.com-存1元送38元彩金| www.19ds.cc-掌上购彩七天彩代理| www.0359.pw-彩票短期规律| www.35359.com-中国福利彩票微信群| www.99159.cc-竟彩网首网-| www.070000.com-极速彩神-| www.140974.com-99彩票官方-| www.224444.cc-快三和值算不算中奖| www.302291.com-快3彩票投注app| www.377157.com-山东福彩领奖地址| www.590097.com-江苏快三预测计划| www.666075.com-jc聚彩彩票-| www.742402.com-掌聊彩票是真的吗| www.os13.com-老彩民app-| www.14aw.com-五分pk彩最准计划| www.90xq.com-小米的彩蛋-| www.2853.wang-七星彩最新专家预测| www.58139.cc-福彩复式怎么玩法| www.102686.com-仲博彩票官网下载| www.176080.com-内蒙古福彩快三代购| www.278861.com-彩票害人的真实故事| www.365931.cc-福彩3d历史开奖号| www.458521.com-贴吧网上买足彩| www.537189.com-都有些什么彩票| www.660862.com-快三计划软件原理| www.864232.com-178彩票下载| www.933167.com-超级彩票工具| www.979728.com-福彩网站下载安装| www.ol93.com-网上能买体育彩票| www.3rv.cc-下载掌上京彩app| www.63af.com-竞彩网开奖结果报码| www.0573.in-玩彩的老头-| www.25945.com-网络语言彩虹| www.69825.com-怎么看彩票中奖没有| www.040374.com-9购十分彩下载| www.126745.com-8k彩票贴吧-| www.200830.com-七星彩软件-| www.273217.com-福彩慈善-| www.378123.com-体彩开奖今天晚上| www.501915.com-体彩排列三和值推荐| www.571561.com-快三趋势-| www.639413.com-为什么买竞彩总是输| www.751384.com-今日彩票图纸| www.820198.com-天价彩礼是卖女儿| www.890806.com-彩票在线试玩| www.961769.com-体彩官方-| 吉利彩票www.66376p.com| www.gh41.com-广西快三号码推荐| www.xf36.com-七彩视界官网下载| www.13xr.com-福彩网私彩-| www.598.cm-最热门私彩-| www.4288.cm-快2彩票-| www.9380.vip-tt彩票正规吗| www.58576.cc-福利彩票双色球规定| www.015647.com-49彩票是正规的吗| www.082633.com-分分快三平台合法吗| www.141521.com-北京快三是骗局吗| www.218108.com-58彩票官方网站| www.287293.com-刷彩票漏洞-| www.415258.com-足彩4串11-| www.515773.com-扬州彩票案件结果| www.582092.com-安徽快三时时彩| www.650753.com-微信十字彩-| www.752639.com-福彩3d专业玩彩| www.851027.cc-什么网可以买足彩| www.914896.com-河内一分彩开奖号码| www.965607.com-福利彩票选4上海| 中国福利彩票www.08588p.com| www.df60.com-七星彩复式玩法规则| www.ti09.com-快三是不是正规彩票| www.8pm.cc-牛娃彩免费资料大全| www.60gk.com-彩票手机在线| www.929.online-49个数字型彩票| www.4617.biz-为什么要买彩票| www.9608.me-福彩农场今天| www.86329.cc-三彩旗下有哪些品牌| www.033235.com-下载新版网易彩票| www.103422.com-乐彩网真的假的| www.161653.com-体彩天下快3| www.272722.com-鑫彩网彩票-| www.356290.com-彩票中奖算法| www.434055.com-六开彩开奖助手| www.521309.com-手机时时彩预测器| www.586194.com-360微彩吧下载| www.654081.com-赢乐彩-| www.772956.com-快3和值中奖彩票图| www.842390.com-彩票公益金的用途| www.891353.com-快三代理利润多少| www.939905.com-辽宁福彩网官网| www.987103.com-迷彩虎下载-| www.cp606.com-大发快三赚钱技巧| www.kb21.com-大庆快三-| www.zc71.com-快三号码组合表| www.20ce.com-足彩19004-| www.661.gg-北京时时彩五分彩| www.3875.xyz-唯彩网大乐专家杀号| www.8731.xyz-顺盈彩票是真是假| www.48834.com-釉下彩-| www.86044.com-彩涂铝生产线| www.031855.com-靠谱的彩票平台网址| www.103698.com-买彩票怎么买的| www.161102.com-彩票天天乐是否正规| www.280352.com-新时时彩基本走势图| www.358257.com-为了买彩票-| www.426670.com-烟台体彩管理中心| www.513659.com-华盛娱乐时时彩平台| www.573221.com-吹吹七星彩-| www.639305.com-体彩店加盟的app| www.815172.com-打彩票好学吗| www.872948.com-uu彩票悠悠小站|