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.999242.com-二分钟快三-| www.o62.com-赠送彩票中奖| www.70fs.com-红菜苔彩票骗局| www.1839.vip-依彩化妆品图片| www.8273.biz-时时彩五星直选技巧| www.nx19.com-新加坡码彩资料| www.236067.com-足球彩票软件| www.28123.com-555彩票黑-| www.101823.com-中原福彩-| www.858958.com-上期中奖彩票号码| www.972766.com-迪士尼彩票为人类建| www.cp2011.com-河北福彩快三一定牛| www.449192.com-沈阳北到省福彩中心| www.151386.com-彩票是啥-| www.395320.com-全天彩是什么| www.556729.com-深圳快乐彩5分开奖| www.639414.com-彩票店有没有刮刮乐| 虹彩集团www.hcjt4.com| www.86272.com-幸运时时彩网站| www.918250.com-下载900彩票| www.983367.com-福利彩票选四走势图| www.jj9.com-北京快三开奖网站| www.375817.com-福彩开奖和值| www.518164.com-163a彩票网-| www.611557.com-腾讯彩虹六号手游| www.82du.com-竞彩高手看盘心得| www.840917.com-彩妆加盟店哪个好| www.949000.com-福彩论坛首页| 大赢家彩票平台www.179223.com| www.932507.com-湖北快三开奖公告| 中彩网www.61233g.com| www.yp49.com-彩票专家排行榜| www.359848.com-福彩今天出奖号码| www.567316.com-苹果背部彩膜| www.453168.com-彩票是实名制的吗| www.969023.com-刷彩票怎么牟利| www.cp2077.com-分分快三技巧规律| www.8555.cc-亿乐彩登录网址| www.83968.cc-彩票能跨省兑奖吗| www.739762.com-中国福利彩票多少位| www.862965.com-钢琴更多精彩小视频| www.051196.com-可以彩票合买的软件| www.588637.com-福彩江苏基本走势| www.715316.com-四季彩登录地址| www.805099.com-七乐彩中奖条件| www.721159.com-彩吧图迷第三版| www.364066.com-3分时时彩软件下载| www.761437.com-腾讯分分彩玩法| www.zl66.cc-彩神1邀请码| www.129708.com-复式彩票中奖计算器| www.734233.com-彩钢琉璃瓦-| www.353077.com-星娱娱乐快彩| www.677236.com-爱投彩票能挣钱吗| www.048747.com-福彩3d陈华杀尾| www.169313.com-快三赌博骗局| www.972115.com-8k彩票贴吧-| www.ah65.com-搜狐体彩福彩网| www.226970.com-福彩3d乐彩网| www.58vo.com-500彩计划网站| www.981828.com-中彩票新闻-| www.ai12.com-7星彩最准专家预测| www.sm12.cc-广东快乐彩走势图| www.14rg.com-彩立子-| www.986149.com-杨震足彩推荐更新| www.117864.com-彩福厨房水龙头| www.235237.com-凤凰微彩app下载| www.cp765.com-快三网是什么| www.862913.com-肥城体彩中3亿| www.68719.cc-廊坊彩票站广阳区| www.3093.vip-成都福彩外围| www.r78.shop-河北快三分析预测| www.40dc.com-彩乐乐好彩一预测| www.199591.com-彩票开奖网-| www.383619.com-彩仙魔力秘肌精华| www.90758.com-好彩丨开奖结果| www.9dq.com-彩票怎么领奖| www.42417.com-558体育彩票| www.937021.com-福星彩票是真的吗| www.968379.com-英国时时彩有官网吗| www.155843.com-辉煌彩票注册网址| www.450053.com-198彩登录地址| www.105908.com-星彩3d-| www.264987.com-江苏老快三最大遗漏| www.899598.com-快三二同怎么看| www.980834.com-江苏体彩网| www.ck00.com-天津快三骗局| www.33643.com-专家说彩李迎| www.656888.cc-九彩彩票软件下载| www.99tr.com-中国福彩管理中心| www.8338.live-七星彩下载苹果手机| www.55799.com-福彩双色球开奖日期| www.130016.com-111cc彩票网站| www.476747.com-一三五台湾福星彩| www.1015.org-腾讯官方快开彩| www.9679.wang-福彩试机号彩宝网| www.54606.com-发信息领彩金| www.05154.cc-那个软件可以买彩票| www.698613.com-手机澳客彩票客户端| www.757569.com-福建体彩36+选7| www.831379.com-广东体彩销量| www.898568.com-下期七星彩预测号码| www.961300.com-彩票网站大众| 凤凰彩票www.88266b.com| www.fq25.com-福利彩票老师| www.vj97.com-福彩中大奖是真的吗| www.03dq.com-彩票k线图教程| www.64cw.com-今日足彩二串一推荐| www.2221.vip-微信微彩是真的假的| www.15xk.com-幸运彩票苹果| www.84qu.com-飞彩网是做什么的| www.607351.com-彩票11选5的玩法| www.666136.com-手机上买体育彩票| www.725411.com-彩快三娱乐网址| www.791691.com-体彩金七乐手机购| www.852608.com-时时彩开奖有假吗| www.405966.com-竞彩2串1倍投| www.027174.com-幸运五分彩开奖结果| www.106621.com-瑞彩祥云如何作弊| www.270308.com-查彩票的软件| www.tv84.cc-福利彩票快开| www.240916.com-彩票历史号码对比| www.360051.com-福建龙岩长汀彩票站| www.501595.com-采全网彩金网彩卷网| www.566246.com-足彩2串一什么意思| www.620200.com-如意彩票网安全吗| www.678261.com-中国体育彩票申请书| www.746902.com-600网投彩票| www.798901.com-彩票8官网-| www.875333.com-亿元彩票的故事| www.937788.com-快三胆码速查表| www.986461.com-nba竟彩-| www.ez27.com-安徽快三形态牛| www.wa49.com-2013彩票开奖| www.983725.com-华宇彩票靠谱吗| www.jr2.cc-体彩481玩法| www.ub67.com-彩票趋势分析理论| www.170596.com-快3彩票玩法介绍| www.147827.com-彩票客户端手机投注| www.8248.cc-东方彩票网是多少| www.82895.cc-今晚体彩开奖直播了| www.998077.com-彩票天天乐登录| www.002924.com-彩票分析软件免费版| www.105257.com-手机时时彩缩水软件| www.218.me-时时彩官方计划| www.942691.cc-买彩票中5元| www.994004.com-上海快三奖金| www.cp7257.com-福彩快3彩票下载| www.ex84.com-彩票助赢软件网页版| 13e彩票www.973390.com| www.518536.com-炫彩曲棍球苹果下载| www.633550.com-99彩票网必中一肖| www.948127.com-彩票到家-| www.988226.com-幸运中彩票天天中奖| www.cp5200.com-今日贵州快三开奖号| www.42.biz-彩泥手工制作大全| www.77yo.com-足彩领奖须知| www.965100.com-福彩快三窍门| www.7546.cm-网投快三是什么彩票| www.764169.com-彩投彩票58-| www.973507.com-彩虹歌词羽泉| www.03bv.com-宝库彩典最新开奖| www.247769.com-湖北红快三-| www.102940.com-海南七彩开奖号码| www.640067.com-22彩票公司在哪里|