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天

知道了
必赢3D www.493785.com-彩票和值尾数| www.611065.com-福彩3d必中秘密| www.030233.com-好运来彩票是骗局吗| www.168777.com-快三一注中奖多少钱| www.95825.com-体育彩票公益口号| www.121842.com-澳洲时时彩开奖查询| www.230040.com-快三模板-| www.329752.com-腾讯体育彩票下载| www.406882.com-港彩奇人网址| www.511882.com-7彩苹果版-| www.653292.com-重庆老时彩时彩开奖| www.030209.com-新浪体彩开奖直播| www.119806.com-鸿彩网极速快三| www.138311.com-新彩网app下载| www.832703.com-下载七彩网-| www.27737.com-足彩今天对阵表| www.400712.com-七星彩和尾走势图| www.gr9.com-上海快三走势| www.365368.cc-众彩网大乐透十专家| www.523345.com-福气彩票结果| www.664101.com-福彩初几开始售票| www.766689.com-彩虹糖代表的寓意| www.896027.com-95彩票快三计划| www.969368.com-彩虹计划网-| www.om55.com-福彩双色球胆拖玩法| www.360059.com-海南严打私彩| www.488149.com-家彩网杀码-| www.95ie.com-体育彩票选几位数| www.739243.com-大通彩票手机板下载| www.833212.com-南海论坛七星彩论坛| www.911841.com-今日福彩3d藏机诗| www.983376.com-彩票c66软件| www.qp39.com-代刷彩票靠谱吗| www.4sd.com-中福彩票在线下载| www.71we.com-2元体彩网-| www.1021.com-梦见火代表的彩票号| www.553976.com-彩蛋连连看-| www.654014.com-网投送彩金58元| www.773411.com-微彩吧是怎么赚钱| www.921268.com-甘肃福彩网官方网| www.985503.com-彩68彩票领导者| www.24121.com-乐彩论坛网首页| www.85172.com-如何提高彩票中奖率| www.076826.com-中华彩票app下载| www.149464.com-广东福彩领奖流程| www.270565.com-安徽省福彩中心查询| www.369467.com-搜索彩票开奖公告| www.814900.com-彩60app-| www.4959.com-福彩彩票平台| www.603888.cc-全民彩票旧版首页| www.jn3.com-广西福彩官网| www.m26.me-福彩快乐十分规则| www.75vd.com-竞彩新规则-| www.2383.cm-好彩原创心水资料| www.8633.top-派彩乐-| www.88044.com-彩票不能提现警察| www.055357.com-浙六江福彩快三网| www.157720.com-足彩18085开奖| www.254258.com-彩票倍投三块| www.332810.com-彩经网官网-| www.417490.com-彩虹六号周边| www.526281.com-做代买彩票合法么| www.676221.com-甘肃省彩礼排名| www.762121.com-福利彩票快三官网| www.871561.com-彩票排名靠前的软件| www.971411.com-高频彩票设计原理| www.bt37.com-彩票挂机软件平台| www.vu92.com-中信彩票是不是真的| www.18kn.com-彩票拖胆-| www.693.mobi-足彩必中窍门| www.5176.cc-韩国2分彩-| www.10070.com-体彩19049期| www.55850.com-k彩最新版本下载| www.004722.com-黑彩平台漏洞| www.079557.com-竞彩篮球玩法| www.150981.com-彩票游戏机说明| www.307826.com-体育彩票店转让| www.381093.com-足彩大王杨光华| www.520916.com-彩票福彩论坛| www.595259.com-福建快三计划| www.670053.com-海南彩票梦册网| www.752357.com-时时中彩票合法吗| www.876514.com-福彩3d太作假了| www.961608.com-各种釉彩大瓶海报| 500彩票www.330256.com| www.ir62.com-手机彩票网软件| www.31hf.com-彩虹岛名片-| www.0868.bid-彩客股票-| www.7642.pw-中国体育彩票标志| www.28012.com-巨力国际彩票| www.73417.com-彩圣网全年资料| www.042369.com-东莞福彩-| www.243782.com-87彩票怎么兑奖| www.325526.com-开奖公告新浪彩票| www.408062.com-濮阳市彩钢厂| www.041191.com-双彩开奖走势图今晚| www.130373.com-最好的彩票查询软件| www.234836.cc-福彩3d中奖结果| www.307407.com-赌场派彩什么意思| www.385461.com-吉祥彩票怎么样| www.624010.com-湖南省福彩报| www.689069.com-山东福利彩票沙龙| www.771704.com-美团机票送的彩票| 大玩家彩票www.9478p.com| www.en85.com-购彩app-| www.8986.top-福利彩票2元中多少| www.75968.com-双色球彩票折叠| www.026911.com-078彩-| www.103335.com-七彩乐今日开奖| www.260311.com-赌博买彩票-| www.355902.com-手机哪里能买彩票| www.442206.com-五洲彩票09690| www.535198.com-福利彩票怎么填数字| www.686824.com-爱开彩十一选五| www.765595.com-苏宁彩票平台可信吗| www.856412.com-苏州彩票店生意转让| www.qs41.com-千亿彩票官网| www.8hw.cc-微彩国际-| www.31636.com-全球彩票最新版下载| www.001515.cc-彩票两元网安全吗| www.069076.com-七彩彩票-| www.132801.com-足彩让球胜平负规则| www.424285.com-三国梦想星彩惨无| www.559710.com-广东七星彩中奖规则| www.139789.cc-盈彩在线下载| www.225961.com-天天中彩票网络骗局| www.8709.org-东方彩票靠谱吗| www.77103.com-彩票大乐透历史号码| www.044101.com-广西体育彩票官网| www.167996.com-宁夏快三-| www.273950.com-二分彩开奖号| www.363927.com-彩虹头像男生| www.444656.com-五彩斑斓的世界剧透| www.521334.com-彩票赚钱群-| www.582882.com-彩票工作室赚钱模式| www.651706.com-中国福彩一倍多少钱| www.845891.com-淘金彩票-| www.897528.com-运用时间差玩时时彩| www.960614.com-云顶彩票网址是多少| 澳客网www.okw4.com| www.be05.com-体彩一等奖兑奖流程| www.rh59.com-极速时时彩怎么老输| www.10nr.com-时时彩票怎么下载| www.71vk.com-恒彩注册送18| www.0398.bid-彩票助赢软件网页| www.7758.vip-体育彩票北海中奖| www.21937.com-刷福彩是什么意思| www.59599.cc-88彩票走势图| www.024944.com-手机彩票过滤器| www.090528.com-投注彩票兼职是真的| www.02944.cc-体彩中了5亿| www.57266.cc-锋彩直播破解版| www.008276.com-大乐彩开奖号码| www.067669.com-非法彩票报警处罚| www.120128.com-宝马彩票网址| www.180899.com-中彩啦下载-| www.242164.com-网上彩票网址有哪些| www.308123.com-福利彩票投注站利润| www.368403.com-933彩票靠谱吗| www.449204.com-hao一分彩票| www.530138.com-彩票开奖查看前十期| www.708167.com-快三历史开奖结果| www.777996.com-978彩票99单机| www.869621.com-乐彩彩票网官网是啥|