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.740061.com-澳门彩网-| www.932317.com-宝盈娱乐彩票平台| 中彩网www.61233g.com| www.386154.com-985彩票靠谱吗| www.606063.com-博盈彩票是不是骗局| www.851414.com-彩客网足彩预测| www.1348.cm-深圳快乐彩5分开奖| www.851840.com-时时彩模拟摇奖机| www.969683.com-彩票不能追号| www.wq7.com-今天彩票开奖号码| www.yj19.com-会员登录一9b彩票| www.28ra.com-搜狐彩票平台怎么样| www.617.tv-欢乐生肖时时彩| www.058953.com-快三交流群是什么| www.89kq.com-博彩彩票游戏| www.246060.com-快三第一门户正规吗| www.427815.com-众彩网3d预测汇总| www.232391.com-网投彩票赚钱| www.183952.com-吉林快三中奖规则| www.257266.com-江西快三投注app| www.338059.com-呼市福彩机转让| www.431368.com-凯利方差算足彩概率| www.526006.com-福彩三d方法| www.019334.com-黔东南彩票大奖| www.839385.com-竟彩足球比分彩客网| www.996403.com-哈尔滨福利彩票中心| www.630538.com-3d下彩报-| www.598292.com-彩票刮刮奖中奖图片| www.oc60.com-彩票导航走势图| www.355084.com-彩赢家号百彩票| www.105320.com-360彩票是真的吗| www.219228.com-彩票之家app| www.318568.com-幻彩彩票-| www.418336.com-全民彩票改名成什么| www.151277.com-湖北快三号码统计表| www.470558.com-博彩和足球的关系| www.630330.com-彩店二维码图片| www.802708.com-山西福彩怏乐十分| www.fh23.cc-快三定码-| www.145257.com-福彩提成-| www.134818.com-彩金彩票app| www.39715.com-爱彩彩票输了7万| www.577721.com-邯郸快三走势图| www.379737.com-大盈彩票做流水赚钱| www.535269.com-12生肖彩票资料| www.id82.com-义乌体彩网-| www.cb45.com-抓黑彩需要什么证据| www.072176.com-彩票实体店-| www.638127.com-色彩构成酸甜苦辣| www.5359.cm-98彩票网手机版| www.516417.com-中发彩票贴吧| www.770028.com-七彩山鸡蛋-| www.903666.com-106时时彩下载| www.ox09.com-福彩3d领袖吧| www.85.cn-3d体彩中奖号| www.91ij.com-百合网交友博彩被骗| www.851884.com-竞彩官网开奖| www.917423.com-胜利彩-| www.970997.com-福彩88app-| 皮皮彩www.569680.com| www.6356.biz-春秋彩票娱乐平台| www.215600.com-彩票号码共有几位数| www.630620.com-今日羊城晚报晚好彩| 大玩家彩票www.9478u.com| www.161810.com-网上买彩票被骗经历| www.359891.com-足彩购买技巧平| www.s83.com-彩票双色球中5个了| www.079061.com-香港牛蛙彩票资料| www.796409.com-尊彩网app下载| 创富彩票www.cf9900.com| www.ii69.cc-福彩在线购买app| www.6kx.com-1到10彩票算法| www.71ds.cc-金巴黎彩票手机注册| www.1225.wang-万豪国际博彩邀请码| www.078978.com-七星彩网-| www.146544.com-北京快三的玩法| www.51524.cc-彩票哪个平台最正规| www.93125.cc-竞彩公司团队| www.055810.com-快三全天助赢计划| www.079756.com-全国彩票计划下载| www.1491.me-彩虹寓意什么| www.9495.cc-彩票的科学购买方法| www.660508.com-彩票万能刷分软件| www.776973.com-重庆时时彩赢钱秘诀| www.59852.com-微彩软件-| www.kr57.com-乐飞彩票app| www.19925.cc-香港彩票资料大全| www.385410.com-159彩票怎么了| www.55976.cc-快三出啥买啥| www.464166.com-彩票开奖公告中彩网| www.560223.com-福彩3d今晚预测| www.61440.com-福利彩票高管被| www.cp505.cc-福彩快三网下载| www.13788.cc-足彩19030期| www.393521.com-长春体彩到哪里兑奖| www.383656.com-今天晚上福彩| www.037783.com-上海爱彩乐开奖结果| www.362416.com-体彩3等奖-| www.531824.com-青春没有彩排| www.680787.com-打彩票输七千多| www.853058.com-香港有没有彩票店| www.cai6522.com福彩快三怎么玩赚钱| www.252213.com-苹果彩膜-| www.377073.com-彩票将试机号| www.474474.com-极速时时彩是骗局吗| www.560098.com-福彩老总被抓| www.632253.com-566彩票下载| www.709030.com-博盈彩票下载| www.785154.com-大胜彩票234| www.874600.com-幸运分分彩平台| www.943448.com-百姓彩坛三十码| 818合彩www.www.8000hc.com| 尊彩www.924570.com| www.rm87.com-基诺型彩票玩法规则| www.217024.com-全国快三有多少个省| www.62727.com-中国竞彩网开奖结果| www.673058.com-中国彩票彩吧助手| www.751051.com-彩票巴巴是合法的吗| www.827665.com-福彩跟单兼职| www.890101.com-百富博彩论坛| www.951641.com-乘风网买彩票登陆| www.cai62.cc-快三今天-| www.309844.com-长春体彩去中心兑奖| www.378726.com-周口体彩中心| www.4904.org-利澳彩票平台手机版| www.425699.com-凤凰竞彩专家推荐| www.761594.com-玩甘肃快三技巧| www.545440.com-中奖彩票生成| www.150321.com-v9彩票合法吗| www.302234.com-河南快三万能三码走| www.663881.com-美职篮彩票预测| www.752667.com-时彩平台出租价格| www.76933.cc-优彩彩票下载| www.708029.com-博彩充值破解| www.250344.com-9424分分中彩票| www.703115.com-福利彩票模拟器| www.899112.com-胜负彩星号什么意思| 500彩票www.500108.com| www.761261.com-好彩妹是哪部电视剧| www.933932.com-彩票电子报纸| 大赢家彩票平台www.609717.com| www.691582.com-足彩19038-| www.699588.com-福彩双色球直播频道| www.197954.com-福彩青海快三| www.958005.com-富彩官网-| www.819438.com-阳光彩票登录网址| www.cp163.cc-贵州福彩助残| www.i63.cn-上快三和值表奖金| www.44hc.com-96彩票网-| www.335.online-天天彩票钻石三肖| www.3184.biz-凤凰vip快三网址| www.7697.xyz-海南体彩电话购彩| www.fl28.com-各种釉彩大瓶名字| www.ou42.com-福彩3b走势图| www.7et.com-中国体彩在哪里领奖| www.56wx.com-江阴福彩店转让| www.757092.com-临时福建彩民论坛| www.dn74.com-彩票数字出现规律| www.247133.com-彩票赚钱s-| www.48024.com-极速时时彩最稳打法| www.259906.com-上海卖体育彩票的| www.5335.biz-彩票15选5-| www.6743.vip-福利彩票怎么网上买| www.24060.cc-中彩时时彩娱乐软件|