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天

知道了
1分快三 www.1525.com-福彩3d定胆图| www.787880.com-澳客手机彩票网手机| www.882377.com-5分彩是真的吗| www.957448.com-腾讯分分彩单双计划| 超级彩票www.cjcp600.com| www.wj09.com-彩神计划软件靠谱吗| www.46pj.cc-福建福彩快讯手机版| www.420323.com-9亿彩票的计划网| PK彩票www.959122.com| www.666727.com-足球彩票的几大因素| www.796504.com-印尼五分彩开奖源| www.732017.com-足彩任选九推荐| www.811885.com-新昌双彩背上的桥| www.884466.com-乐彩双色球论坛综合| www.957061.com-手机彩票自动挂机| 8号彩票www.81520h.com| www.098933.com-电脑彩色打印机| www.wr76.com-567好彩-| www.789905.com-乐福彩三地-| www.918115.com-黑彩5分钟一期| www.kf15.com-玩京东彩票幸运28| www.386648.com-尼彩手机以旧换新| www.51715.cc-时时彩计划倍投表| www.22853.com-全民赢彩票提现不了| www.95308.com-福彩守号倾家荡产| www.142301.com-福利彩票快3代玩| www.723853.com-在线福彩app| www.828036.com-彩民网是什么| www.921357.com-彩神1分快三辅助器| www.515129.com-七星彩三字怎么打| www.215799.com-福彩3d技巧规律| www.323363.com-大庄家彩票网站| www.461346.com-九九玩官方彩票| www.611498.com-长春彩报先锋快报| www.773468.com-彩票过滤大师2.3| www.937230.com-十二釉彩大瓶| www.ze4.com-福彩快3怎么玩的| www.5yp.com-牛赑彩票官网| www.44es.com-彩之云是什么| www.579251.com-上海福彩网网站| www.eq10.com-快三秒奶茶加盟店| www.29pl.com-昨天体彩号码| www.610135.com-彩票777好不好| www.7796.in-时彩组六买法| www.657365.cc-306手机彩票网站| www.ja1.com-内蒙古快三爱乐彩| www.4345.cc-腾龙时时彩官网| www.04382.com-彩票店扫码出票软件| www.ap17.com-贵州福利彩票双色球| www.zw40.com-上海体彩网点申请| www.597562.com-网彩赚钱是真的吗| www.362078.com-彩票网钱取不出来| www.585396.com-首充一元送18彩金| www.100934.com-哪个彩票软件可靠| www.196166.com-安徽快3爱彩乐网| www.82916.com-新时代竞彩推荐| www.241011.com-《星空》画彩铅教程| www.503893.com-易博彩票是黑平台吗| www.781204.com-海南彩票规律讲解| www.4989.org-香港新港彩官方网| www.685709.com-乐彩网头条-| www.89381.com-福彩票软件-| www.07611.com-七星彩买多少钱一注| www.021058.com-湖北省体育彩票官网| www.151958.com-彩之网3d绕胆图| www.99872.cc-太子彩票网页版| www.189546.com-福彩林竹杀码| www.439877.com-彩票网支持花呗| www.6145.vip-如意彩票快三骗局| www.31498.com-唯彩会开奖结果| www.435.hk-河北快三奇偶啥意思| www.57487.com-加导师买彩票| www.7003.com-怎么买nba彩票| www.69331.cc-竞彩专家推荐预测| www.xf32.com-彩中堂xyxxcc| www.83487.com-好彩客彩票| www.2984.pw-9万彩票苹果版下载| www.349958.com-大发时时彩后一技巧| www.521128.com-美女带玩彩票| www.690506.com-福彩官方快三有哪些| www.459062.com-爱彩乐四川快乐十二| www.880164.com-福彩3d杀码条件| www.cai2929.com安徽快三形态走势图| www.957212.com-快三推广的话术| 双赢彩票www.sytg8.com| www.507850.com-竞彩猫小鱼儿微博| www.881086.com-彩票选号技巧与方法| 彩宝www.cb2388.com| www.157755.com-竞彩盈亏指数| 彩世界www.99788j.com| www.517209.com-4146牛彩-| www.282538.com-时时彩不亏钱的买法| www.497897.com-婚恋博彩骗局帮充钱| www.3251.net-在哪里下载冠彩网| www.027719.com-合乐彩票注册| www.0463.xyz-竞彩足球app彩票| www.105937.com-代购美国彩票合法吗| www.1422.com-购彩ⅲ软件安全吗| www.1409.shop-开乐彩下载-| www.063046.com-营口福彩-| www.9706.org-亚博彩票快三| www.4108.vip-云彩厅里有苏州快三| www.04567.cc-怎么买足彩-| www.48766.com-彩票北京拾-| www.94689.com-竞彩套利方法| www.057184.com-7070彩票官方| www.214005.com-彩神2苹果版| www.291164.com-福彩3d五行九宫图| www.377182.com-腾讯时时彩彩开奖| www.566274.com-足彩二串一实战技巧| www.657783.com-黄金屋368彩票| www.739692.com-彩票计划苹果| www.847388.com-飞龙在天竞彩专家| www.951624.com-彩票研究技术| 大赢家彩票www.541911.com| www.253919.com-彩票举报电话| www.334421.cc-六冠彩票能提现吗| www.2450.win-易彩快三是什么| www.899216.com-七星彩票彩种| www.981915.com-彩票三d试机号| www.bg81.com-彩票计划师的大揭秘| www.tf21.com-安徽快三跨度表| www.22348.cc-女方提出离婚彩礼退| www.843066.com-体育彩票资金用途| www.24vf.com-彩色手机膜-| www.260.tv-足彩串串容错表| www.4044.site-彩票捡到-| www.153633.com-代理广东福彩| www.224520.com-快三猜和值大小技巧| www.f64.org-福利彩票视频| www.355924.com-网络彩票输光了| www.465448.com-苏式彩画高清图片| www.555308.com-博彩论坛送白菜专区| www.615044.com-六合开彩现场168| www.669697.com-网上哪里卖海南私彩| www.726285.com-快三老千-| www.779812.com-买彩票也不中| www.831828.com-福彩七乐彩下期预测| www.892896.com-体彩开奖结果查| www.948187.com-福彩中心新主任是谁| www.984374.com-中国正规彩票app| www.cp9.vip-江西快三彩票网页| www.ih55.com-新利18快乐彩| www.vb07.com-福彩3d历史上今天| www.590912.com-竞彩软件排行| www.292986.com-福彩专家杀码| www.365458.com-美丽的城市彩铅画| www.154755.com-足彩竞猜玩法介绍| www.r32.net-快三8期容易开| www.7883.vip-爱彩乐辽宁11选5| www.26278.cc-彩吧网下载安装| www.214.cm-鼎盛彩票登陆网址| www.044898.com-江苏福彩开奖号码| www.c26.top-博彩王彩票预测| www.98xq.com-彩天下378-| www.7412.vip-色彩斑斓的近义词| www.39225.cc-彩票规则和开奖日期| www.mk9.cc-五分钟幸运快三计划| www.188504.com-江苏快三爱-| www.247062.com-彩票分析师大赛| www.4653.org-5a彩票平台登录| www.214234.com-足彩分析师团队招聘| www.321523.com-万能彩票软件| www.438669.com-五彩影院-|