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.mn83.com-时时彩漏洞刷钱教程| www.26052.com-雨后彩虹象征什么| www.78639.cc-天天好彩944cc| www.042669.com-体彩竞彩店太大| www.307810.com-腾讯分分彩漏洞百出| www.302073.com-体彩十一选5怎么玩| www.115706.com-欧洲彩票代购| www.193167.com-快三中奖图表| www.002172.com-彩票目前最-| www.127481.com-好运彩彩票官方网址| www.272918.com-刷福彩的流水是什么| www.ub21.com-体彩名词灯谜| www.61nd.com-网易竞彩分析| www.998981.com-青海快三推荐今天| www.41yl.com-中彩票v2.06| www.3775.cm-体育体彩开奖查询| www.746422.com-酷彩吧能买彩票吗| www.42843.com-王牌彩票下载手机版| www.02623.com-魔方彩票软件| www.67833.com-重庆时时彩360杀| www.019378.com-贵州遵义彩票中奖| www.579304.com-体彩排三丹东全图| www.664683.com-彩民之家a新图| www.737053.com-彩票代打平台| www.999674.com-湖南福彩动物总动| www.go22.com-内蒙古彩票快3| www.848501.com-安徽时时彩开奖结果| www.677777.com-彩票改单是真的吗| www.267008.com-胜负彩19045期| www.509783.com-顶级彩票登录| www.832072.com-093彩票公安| www.hm86.com-时时彩个位对胆| www.220.me-想开个彩票店| www.04447.cc-微信提现彩票教学| www.012826.com-七星彩开过七个七吗| www.051501.com-赢彩网大发快3下载| www.80ij.com-博瑞彩票app| www.150463.com-中彩网号码分折| www.4591.biz-酷彩吧中奖有用吗| www.bn12.com-彩票平台拉人骗局| www.42yf.com-彩票讲堂中彩视频| www.3409.vip-竞彩足球怎么打赚钱| www.29ae.com-国富彩票是什么意思| www.rk30.com-百盈彩票是什么| www.80186.com-仙彩-| www.032936.com-七星彩今晚推荐号码| www.112672.com-一分时时彩刷反水| www.183603.com-彩票怎么买-| www.556014.com-凤凰黑彩登陆| www.624691.com-彩票刷流水话术| www.694396.com-排三众彩专家预测| www.773229.com-彩票送彩金16| www.877003.com-各类彩票玩法| www.953503.com-一分快三输了30万| www.5092.vip-时时彩定胆5码公式| www.da12.com-彩票争霸8网址| www.cp5225.com-内蒙爱彩乐11选5| www.12gi.com-快三开奖时间改变| www.2445.pw-极速时彩开奖号码| www.29410.com-苹果手机彩票平台| www.032106.com-香港赛马赛果和派彩| www.784895.com-彩民中奖故事| www.330013.com-山西体彩网彩| www.928006.com-高频彩种-| www.yr.com-上海的快三走势图| www.025.pink-七星彩番外篇明月珰| www.7235.cn-彩6机票啥意思| www.39931.cc-彩票巴巴下载| www.917798.com-彩虹岛手游-| www.976663.com-四川成都彩礼价格表| www.af69.com-智慧彩官网下载| www.zb53.com-福彩3d彩报图库| www.75lh.com-彩猫烟哪里有卖的| www.1684.xyz-高频彩票如何盈利| www.610292.com-七彩星体育彩票| www.318346.com-徐州大奖彩票图片| www.610650.com-新彩彩票么样注册| www.20xj.com-足彩戴维最新推荐| www.5039.net-七星彩几等奖咋分的| www.30594.com-选彩票软件-| www.99293.com-玩天天彩票技巧| www.107032.com-澳洲时时采彩开奖| www.233931.com-快三游戏是啥意思| www.361026.com-正规高频彩开奖网站| www.441377.com-百宝彩视电话| www.683007.com-体彩新规定-| www.585608.com-没财命的中彩票好吗| www.fm6.com-重庆时时彩已下架| www.580760.com-大通彩票导航网| www.676577.com-彩吧论坛彩票论坛| www.795262.com-赌博一分快三规律| www.559622.com-幻彩曲棍球小游戏| www.209913.com-吉林快三我输80万| www.337543.com-易彩能提现吗| www.484123.com-旭彩网36元-| www.666603.com-高频彩止损技巧| www.nh64.com-彩票大赢家论坛| www.7600.net-湖北福彩快3走热| www.164045.com-竞彩不应该容错| www.0936.tv-跟单体彩-| www.8472.com-999彩票官方网址| www.641822.com-今晚福彩图片大全| www.858045.com-快三是彩票吗| www.13374.com-彩票缴费通支付宝| www.372306.com-福彩开奖号是多少| www.759135.com-彩薇花化妆品| www.815326.com-秒开彩-| www.875218.com-皇冠彩票被黑了| www.929767.com-体彩足球竞彩玩法| www.975442.com-分分彩杀号口诀| 博友彩www.776860.com| www.961847.com-成都竞彩快三开奖| www.486801.com-天天彩选四中奖规则| www.836959.com-一定牛彩票苹果版| www.952634.com-上海快三计划| www.cp926.com-今天快三结果图湖北| www.039073.com-爱投彩票赚钱吗| www.206516.com-买高频彩票的技巧| www.506797.com-彩票可以研究吗| www.630863.com-彩票6期倍投技巧| www.758221.com-987彩票骗局| www.908899.com-福彩交流-| 致富彩票www.zfcp4.com| www.qy21.com-极速时时彩怎么选号| www.62rl.com-ff14彩票周六| www.7625.top-新浪爱彩骗局| www.53296.cc-分分彩智能计划软件| www.53839.cc-如何举报福彩体彩| www.gm78.com-彩票查询官网| www.445055.com-义乌市福彩网| www.553293.com-邯郸市体育彩票地址| www.993636.com-足彩开奖一般在几点| www.mf92.com-彩宝网3d遗漏统计| www.11gi.com-博众时时彩预测软件| www.479707.com-如何看盘口买足彩| www.538283.com-彩云国物语结局| www.475008.com-重庆时时彩任选四| www.010204.com-网上带你玩彩票的人| www.031686.com-977的cc彩票| www.1ab.cc-体彩排列三字谜图迷| www.91vg.com-网络彩票计划群流程| www.09726.com-手机上购买福利彩票| www.70297.com-恒发彩票亏了50万| www.kn56.com-幸运快彩-| www.656731.com-色彩性格测试| www.883957.com-黑彩赢钱技巧| www.xi49.cc-虎扑神棍区篮彩| www.961711.com-58福彩app下载| www.al.cc-北京快三今晚推荐号| www.br08.com-彩票基本走势图大全| www.88065.com-排三杀码定胆彩经| www.661462.com-今天三d彩报图| www.t00.cc-贾峪彩票中奖| www.358464.com-信博彩票下载安装| www.087605.com-彩票投注站会改革吗| www.256822.com-购彩助手app下载| www.507366.com-甘肃亿彩快三查询| www.567793.com-万福彩票77-| www.623579.com-財富彩票-| www.40288.cc-2020网络彩票| www.787830.com-胜负彩19055| www.194062.com-官方极速快三彩票| www.291357.com-掌上彩票网-| www.2815.org-兰州彩票店移机|