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天

知道了
彩票123现在叫什么名字 www.266901.com-江苏体彩中心| www.433018.com-盈彩吧是什么意思| www.553224.com-邯郸体育彩票站点| www.643196.com-幸福彩票官方| www.792098.com-那个快三软件准| www.883412.com-彩票彩金大全| www.968474.com-鲍学全控制中彩票| www.in92.com-齐鲁七乐彩预测| www.q06.com-快三会上瘾-| www.63ue.com-体彩3d开奖结果l| www.1618.cm-全国地方彩票开奖号| www.9463.xyz-中国人在外国买彩票| www.52986.cc-澳门时时彩app| www.009177.com-彩123论坛下载| www.083372.com-授渔看彩-| www.166987.com-新快三下载-| www.257347.com-网络彩票追回钱款| www.346809.com-明彩电视是杂牌吗| www.448997.com-福彩主任视频| www.555240.cc-红彩app安装| www.647010.com-足彩老是差一点中奖| www.773187.com-竞彩精灵-| www.867117.com-微彩宝app下载| www.948490.com-福利彩票自助机| 网易彩票www.36788f.com| www.jc30.com-大发快三漏洞| www.q54.xyz-双阳区黑彩-| www.47jj.com-洛阳金手指足彩推荐| www.722.xyz-时时彩怎么倍投盈利| www.4885.com-足彩情报最多平台| www.12156.cc-立彩佳官网-| www.62457.com-彩票快三的技巧| www.040981.com-重庆时时彩长龙记录| www.129394.com-一分快三下载公众号| www.218626.com-快开彩票-| www.306206.com-彩6com彩票-| www.672798.com-休闲快三教学视频| www.nl38.com-365福利彩票| www.62kb.com-51彩票全天计划彩| www.1278.cc-乐彩网站诈骗| www.04070.com-全民中彩票app| www.63118.com-足彩那个app靠谱| www.028540.com-彩票案子-| www.123557.com-5k彩票手机领导者| www.199826.com-甘肃省快三遗漏号| www.278857.com-快三秒热水器水小| www.356553.com-宁波年会发彩票| www.464829.com-pp彩票是真的吗| www.555269.com-旭辉研彩软件app| www.617188.com-延吉黑彩-| www.702412.com-天下天空彩-| www.798111.cc-山东11选5彩票| www.885090.com-家彩网3d胆码预测| www.981102.com-彩票彩六-| www.9488.loan-彩票专业选号器| www.40489.com-中彩网讨论-| www.85618.com-彩票凤凰计划| www.055169.com-网络黑彩处罚| www.131603.com-云南福彩票-| www.219062.com-百姓彩-| www.306718.com-哪些彩票平台好| www.387672.com-温州市体彩兑奖中心| www.515719.com-铜陵中彩票-| www.598872.com-网络彩票源码| www.690197.com-c8cn万彩吧开奖| www.839313.com-江苏快三怎么下不了| www.920537.com-彩争霸8下载| www.992878.com-福彩365安装| www.jt1.com-快三动态走势图河南| www.914545.com-福龙彩票全民快三| www.978418.com-好彩店彩票ios| www.cp8498.com-湖北快三今天开奖号| www.ot74.com-福彩17500首页| www.44ux.com-天荣国际区块链彩票| www.984.bid-游戏机奖励彩票| www.7922.cm-现金彩票-| www.33753.com-乐迷体彩-| www.82637.cc-足彩19024预测| www.041220.com-秒速高频彩长龙提醒| www.166490.com-快三开奖结果江西| www.262708.com-长春市福彩中心位置| www.360061.com-福彩投注下载官网| www.440365.com-体彩大乐乐开奖结果| www.542349.com-钻石彩票软件下载| www.606675.com-彩票假-| www.683253.com-开心彩红app下载| www.766596.com-最新版全民福彩| www.850406.com-足彩二串一玩法| www.909308.com-宝马彩票平台靠谱吗| www.962472.com-山东齐鲁彩票双色球| 快彩www.81678p.com| www.gd84.com-快三街机视频| www.yz90.com-快三精准人工计划| www.29hm.com-五个号的彩票是什么| www.1229.me-彩神通四码-| www.8154.org-高频彩票改20分钟| www.32887.com-彩票排列三走试图| www.80202.cc-体彩大乐透秘诀| www.035074.com-倍率高的彩票网址| www.159774.com-网上购买足彩app| www.252656.com-超级时时彩是真的吗| www.315919.com-大公鸡七里彩下载| www.375338.com-七星彩什么台开奖| www.483985.com-黑彩票网站大案| www.545550.com-推广彩票的软文| www.605502.com-彩晶膜批发-| www.667388.com-内蒙古彩票发行中心| www.731772.com-彩色包装盒公司| www.805155.com-七乐彩7等奖多少钱| www.879643.com-福建福利彩票| www.943811.com-234彩票平台官网| www.986159.com-滴滴彩票送28苹果| www.cp516.cc-快三官方平台| www.mp03.com-微彩吧兼职是真的吗| www.1xh.cc-福彩选5的玩法| www.57xa.com-中彩那天精美词语| www.0461.xyz-致富彩骗局-| www.8474.top-体彩机转让北京| www.38375.com-k彩进入网站| www.86833.cc-竞彩猫合买微信群| www.040966.com-500彩票漏洞赚钱| www.147977.com-腾讯快3彩票平台| www.234491.com-时时彩平台推荐| www.296439.com-福彩开机号-| www.355509.com-常州中奖彩票被调| www.414790.com-七彩蓝田项目| www.503927.com-鸿博股份彩票软件| www.562603.com-南方神彩专家专栏| www.618103.com-易旺彩票可信吗| www.675070.com-掌游彩app下载| www.734953.com-彩神通关注码是什么| www.794368.com-黑客植入重庆时时彩| www.857135.com-菲律宾彩票推广工资| www.906953.com-福利彩票分几种| www.956093.com-玩彩票怎么控制贪欲| www.997679.com-爱心彩app-| www.eu.com-北京快三推荐和预测| www.983263.com-盈彩网玩抄江苏快三| www.960350.com-云顶至尊app彩票| www.cp5592.com-福彩3d和值走势图| www.xx01.com-彩六官网-| www.56ja.com-湖南体彩网彩吧论坛| www.687358.com-湖南体育彩票网| www.778243.com-一分钟快三走势图| www.pr57.com-彩经网3d试机号| www.9kc.cc-广西快三最大遗漏表| www.67qm.com-全国有多少彩票站| www.890.in-制作彩票软件下载| www.4776.me-腾讯一分彩开奖结果| www.00420.com-南京华彩彩票可靠不| www.92113.cc-顺丰彩票安卓版| www.050197.com-地下黑彩量刑| www.122111.cc-澳洲时时彩网址| www.191026.com-北京快三奖金怎么算| www.265365.com-宁夏体育彩票十选五| www.333861.com-中国体育彩票成本| www.399663.com-上海足彩兑奖地点| www.505494.com-中国彩票奖金计算器| www.573786.com-万能彩票机笔趣阁| www.021409.com-上海快三012路| www.303408.com-优乐彩票不给提现| www.378052.com-七彩阳光音乐带口令| www.596195.com-彩票投注倍数| www.657817.com-体彩大乐透卖到几点|