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天

知道了
彩39彩票安卓 www.17317.com-3d彩票怎么算中奖| www.009503.com-三d彩票论坛首页| www.100532.com-易赢彩票合法的吗| www.182050.com-vip彩票网站| www.268107.com-福彩缩水软件下载| www.509110.com-福彩双色球开奖频道| www.597656.com-彩薇花化妆品安全吗| www.688185.com-体彩电子投注单| www.777310.com-购彩平台是真的吗| www.907585.com-体彩即时彩几点结束| www.981102.com-彩票彩六-| www.br42.com-彩经网旧版-| www.wp33.com-彩票走势图哪个好用| www.29ik.com-海南体彩投注软件| www.0723.me-澳客彩店骗局| www.8193.bid-澳门富民彩官方资料| www.37386.com-购彩网658835| www.91487.com-绿好彩是爆珠烟吗| www.063935.cc-时时彩票注册app| www.191900.com-如何查福利彩票开奖| www.278949.com-财神彩票下载| www.384022.com-苹果版澳客彩票| www.518974.com-a5国际高频彩票| www.601822.com-卖福利彩票怎么开店| www.687100.com-重庆快彩快三| www.774711.com-七乐彩几个号能中奖| www.900614.com-注册就送彩金的网站| www.974625.com-网上怎么买体彩| www.sa8.com-彩神88-| www.tp48.com-大亨彩票-| www.14ki.com-彩金宏辉照片| www.769.net-赢彩王专业版账号| www.5640.in-网恋时时彩诈骗| www.16523.cc-五分时时彩平台| www.66141.com-最强彩票选号大师| www.065456.com-风景彩铅画教程| www.158786.com-团队买彩票是真的吗| www.257051.com-中国福彩快三新规| www.340070.com-金彩国际是什么| www.434513.com-网易湖北快三走势图| www.538009.com-颜色的彩色-| www.662508.com-预言家专业彩票计划| www.750047.com-中发彩票靠谱吗| www.825139.com-竞彩二维码扫码出票| www.901882.com-福彩体彩开奖信息| www.971778.com-快捷彩票网是真是假| www.eu18.com-大发时时彩正版下载| www.yd94.com-七星彩专家预测杀码| www.29fi.com-水彩画天空教程| www.0322.cn-新乡彩票店转让信息| www.7504.cc-体彩终端远程控制| www.27698.cc-花绘画图片大全彩铅| www.73715.com-香港二分彩-| www.030281.com-中彩网快三助手下载| www.114424.com-什么彩票app好用| www.189354.com-彩票平台刷流水技巧| www.269315.com-三分彩攻略-| www.515920.com-竞彩足球提成| www.590173.com-体育彩票家彩开机号| www.666377.com-乐彩提成-| www.750820.com-香港百彩网开奖结果| www.827858.com-彩民网是哪个app| www.904440.com-668彩票骗局| www.970594.com-福利彩票6000万| www.ir73.com-国外彩票app| www.c46.com-快三客户端-| www.35vw.com-小白彩票怎么推广| www.0906.xyz-体彩导航-| www.7862.biz-胜负彩购彩技巧| www.31553.com-彩票一天赚10万| www.76630.com-玩彩票大平台登录| www.028371.com-博友彩票app| www.107479.com-凤凰彩票辅助器| www.180488.com-一分快三骗局| www.255977.com-赢彩票app-| www.329753.com-3d彩吧图第二版| www.406310.com-形容彩虹美的句子| www.518587.com-辽宁彩票中心| www.589813.com-大地彩票-| www.661798.com-七星彩放假时间| www.870326.com-盛大彩票靠谱吗| www.952211.com-快彩电视版-| 吉利彩票www.66376r.com| www.eu38.com-彩神破解版-| www.vt68.com-信誉时时彩平台出租| www.13dl.com-伯乐彩票平台| www.81hu.com-福少时时彩官网| www.1905.online中彩网的网址是多少| www.8033.net-赌十字彩玩法| www.28511.cc-中彩网乐和彩彩票| www.74973.com-分分彩后二稳赚技巧| www.026834.com-刷彩金平台-| www.104927.com-盛大彩票官方网站| www.172511.com-快三彩票骗局全过程| www.366623.com-微信不能买彩票了吗| www.459035.com-大乐透机选彩票号码| www.551284.com-风采与风彩哪个对| www.657163.com-体育彩票游戏机| www.742800.com-新星彩app-| www.814804.com-吉林快三大小微信群| www.887944.com-彩票网站如何推广| www.973746.com-彩票代理日结佣金| www.ym.cc-江苏福彩快三下载| www.nr74.com-玩彩赌博-| www.4fw.com-彩票店没人怎么办| www.60yo.com-首页青蛙彩票| www.0506.top-中囯彩吧更懂彩民| www.8435.loan-湖北彩妆培训学校| www.38755.cc-福彩3d专家号| www.83224.com-彩票翻倍投注| www.033105.com-900彩票-| www.107096.com-澳洲3分彩-| www.171312.com-北京十一选五体彩| www.298882.com-中国手机福利彩票网| www.367832.com-湖北快三二同号推荐| www.454120.com-聚鑫乐彩怎么充值| www.540899.com-凤凰彩票8553| www.654780.com-重庆分分时时彩技巧| www.739481.com-体彩加盟条件| www.809528.com-全彩助手下载| www.882805.com-易彩娱乐赢多少会黑| 500彩票www.349277.com| www.gp71.com-易彩彩民福地app| www.wx26.com-新浪竞彩推荐| www.11gt.com-陶瓷新彩画-| www.76ze.com-08年福利彩票中奖| www.1336.in-福彩双色球怎样选号| www.04561.com-下彩网是真的吗| www.45500.cc-有什么彩票可以刷水| www.86939.com-上海快三查询图| www.034360.com-nba篮球彩票推荐| www.142036.com-体彩近十期试机号| www.215755.com-安徽体彩票十一选五| www.282133.com-江苏快三开奖网址| www.383735.com-彩票彩客网旧手机版| www.501413.com-易彩云app邀请码| www.567312.com-1江苏福彩-| www.630089.com-彩票65616-| www.699602.com-福彩3d太福字谜| www.773096.com-天际彩票平台邀请码| www.892428.com-查询彩票最好的软件| www.959876.com-吉林快三到晚上几点| 易彩网www.36166w.com| www.ch67.com-黑彩快三漏洞| www.ry42.com-福彩3d专区-| www.12iu.com-梦见彩虹还拍照| www.73cq.com-中国福利彩票赛车| www.0777.biz-足球彩票用软件| www.8154.org-高频彩票改20分钟| www.25482.com-宝典彩图-| www.64002.com-足球竞彩新浪网| www.030336.com-亚博体育假彩票| www.097333.cc-极速时时采彩骗局| www.154366.com-玩彩票官方大平台| www.255752.com-k彩登录网址| www.318250.com-水彩抽象画创意| www.380867.com-天天彩直播开奖| www.513431.com-时时彩只玩大小单双| www.575289.com-旺彩推荐软件| www.637581.com-彩虹6怎么玩| www.738119.com-湖南福利彩票怎么选| www.800165.com-福利彩票开奖l| www.867740.com-快三全骰什么意思| www.956016.com-彩票软件破解|