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.cai2342.com北京快三预测推荐| www.p50.biz-体彩所有玩法| www.80ob.com-中国彩吧更懂彩民1| www.3167.com-彩票中了三个数字| www.9852.loan-古建彩绘龙-| www.93587.cc-zc66cc中彩网| www.071316.com-足彩培训师报名| www.149844.com-幸运中彩票老版本| www.274673.com-体育彩票机选| www.374011.com-大星体彩福彩走势图| www.509722.com-博彩开发-| www.592250.com-四海图库彩看图区图| www.675023.com-汇丰娱乐彩票| www.759044.com-66微彩-| www.917199.com-88彩票是真是假| www.984349.com-竞彩猫充值-| www.dn58.com-快三遗漏号数据查询| www.yk46.com-彩31彩票平台| www.33mx.com-体彩大乐透截止时间| www.1049.vip-彩彩网8.5邀请码| www.8284.cn-重庆时时彩玩牛牛| www.34341.cc-乐彩福彩3d胆排| www.85949.com-彩涂用途-| www.052387.com-快彩网中奖助手| www.180551.com-甘肃福彩快三走势图| www.265397.com-双彩网首页-| www.370654.com-神彩软件官网| www.481728.com-体育彩票游戏玩法| www.568689.com-贵州体彩领奖| www.652044.cc-福彩每周开奖日期表| www.777712.com-星彩娱乐下载| www.875009.com-福彩20选8陕西| 六福彩票www.66ffo.com| www.fa66.com-河北快三历史开奖号| www.yl91.cc-大乐购彩票开奖| www.30gh.com-国彩开奖结果| www.1391.cn-牛彩网诗谜-| www.8624.cc-带走势图的彩票软件| www.47186.com-竞彩3串3什么意思| www.96993.cc-单场足彩技术| www.067651.com-彩乐乐网站正规吗| www.139979.com-中国福利彩票吧| www.228903.com-306彩票下载| www.311827.com-福彩3d图库-| www.388709.com-福彩字谜软件下载| www.582279.com-网冠彩-| www.661741.com-七星彩开奖提醒| www.768778.com-粤淘彩票官方网站| www.864086.com-九亿彩票软件| www.938465.com-澳客彩票网安卓版| www.999318.com-快三如何回血| www.ty2.cc-派彩网北京快三| www.sc90.com-吉林快三坑害多少人| www.19qm.com-我精彩的恐龙视频| www.453.tv-福利彩票中两个号码| www.4905.cm-职业彩票玩家生活| www.07283.com-竟彩足球必发指数| www.55313.com-时时彩的玩法和规则| www.002987.com-体彩七星彩摇奖器| www.073813.com-彩的含义是什么| www.144404.com-好彩堂跑狗图彩报| www.305939.com-彩票网站时时彩| www.382252.com-彩票计划在线聊天室| www.520828.com-彩票中奖喜报| www.593069.com-七彩国际汇所| www.670211.com-风采还是风彩| www.751467.com-eg彩票平台注册| www.823647.com-山东彩板厂家| www.895701.com-博彩套利贴吧| www.970223.com-网络彩票老师带单| www.tw50.com-全国彩票2元开奖号| www.09gq.com-七乐彩卖到几点| www.84kx.com-彩票程序员-| www.2258.cn-体彩三句话字谜区| www.8288.in-梦想彩票站彩种| www.30049.com-金利彩票大发快三| www.75200.com-九五彩票下载安装| www.026805.com-01彩票违法| www.103633.com-体彩官网各开奖结果| www.171038.com-玩彩口诀-| www.341006.com-体彩大乐透欢迎语| www.425643.com-福彩心得-| www.526312.com-快购彩票三骗局| www.633109.com-竞彩推荐焦点篮球| www.702326.com-中国足球彩票开奖| www.779859.com-联机彩票机-| www.858627.com-彩神幸运飞艇破解版| www.926191.com-七星彩澳客网预测| www.982702.com-上海福利彩票地址| www.jw39.com-老版彩库2015| www.c63.vip-讧苏休肓彩票| www.31bj.com-彩虹秒赞网源码| www.981.in-海南私彩包码技巧| www.6740.vip-必中彩票邀请码| www.22426.com-七星彩中几个号有钱| www.68806.com-如何选彩票号| www.132264.com-福彩刮刮乐彩票订做| www.211393.com-彩报第一版今天| www.288176.com-大乐透彩票投注大厅| www.424122.com-最近的福利彩票站点| www.529018.com-中国数字彩票| www.653861.com-3d福彩大全-| www.759908.com-福彩3d和值余0| www.864462.com-长红彩票app| www.932507.com-湖北快三开奖公告| 500彩票www.50064f.com| www.jl34.com-九度彩票可以赚钱吗| www.c10.space-彩民福地客服| www.32iv.com-陇彩宝海报-| www.1803.cc-哪些高频彩是国家的| www.9912.com-广州汇彩路酒店| www.63787.cc-竞彩购买量-| www.033187.com-福彩大众网-| www.111723.com-河北快三每天几期| www.181181.cc-今日中彩下载| www.385396.com-酷彩吧网页版登陆| www.543298.com-彩尊登陆-| www.639876.com-东方亮彩哪个部门好| www.746755.com-505彩票网站多少| www.818629.com-5百万彩票网官方| www.909960.com-昆明靓彩招聘| www.982715.com-彩票体验金-| www.tu60.com-华夏彩app下载| www.10hl.com-跳快三锻炼身体吗| www.71ng.com-彩票诗歌-| www.1986.site-福彩体彩在一起| www.7663.in-福彩图片精美| www.521963.com-河内五分彩预测软件| www.633787.com-七彩教育理念| www.830292.com-彩票注册送29| www.900761.com-久久彩票坑人| www.964328.com-体彩官网首页电脑版| www.ed0.com-彩票20分钟一期| www.of86.com-彩票图吧-| www.10as.com-分分时时彩源码出售| www.81fh.com-118彩票网骗子| www.1892.com-1号彩票网站首页| www.55209.com-彩图网站-| www.98072.com-排列三试机号彩票| www.062477.com-福彩3d图迷yin| www.231305.com-中中彩票下载安装| www.292968.com-甘肃快三彩控| www.365342.cc-卖彩票的利润| www.462393.com-中彩双色球500| www.581390.com-世界杯竞彩足球分析| www.658824.com-36o七星彩走势图| www.770746.com-建盏怎么养出七彩光| www.866520.com-上海快三8千期遗漏| www.931636.com-怎么破解彩票中奖| www.981749.com-大庄家彩票app| www.pc87.com-乐彩图表-| www.07ts.com-水彩星空画-| www.77fv.com-零零时时彩手机版| www.2430.cc-五分彩是哪里的彩票| www.8924.net-天美彩票聊天室| www.91865.cc-福利彩票高频彩漏洞| www.047499.com-福彩中奖助手下载| www.139887.com-绵阳福彩分中心官网| www.213953.com-彩神lll-| www.283197.com-体彩彩种-| www.421511.com-体彩7位数短信点播| www.518177.com-苹果手机炫彩灯光| www.573708.com-时时彩后三计划技巧| www.638956.com-福利彩票是谁创建|