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天

知道了
7星彩 www.686328.com-体彩跟福彩什么区别| www.830299.com-6000万彩票平台| www.915112.com-足彩今日推荐竞彩网| www.980199.com-竞彩胜负-| www.jm41.com-大发快三是人为| www.zx47.com-上海快三今天推荐| www.32yx.com-开体育彩票店需要| www.2521.wang-彩图诗句看图解码| www.7897.net-分分彩太假了| www.23944.cc-海南七星彩微信诈骗| www.71212.cc-谁有天际彩票邀请码| www.119336.com-玩彩票安卓版下载| www.195850.com-福利彩票江西快3| www.271355.com-街机游戏快三带重腿| www.380869.com-上海选4走势图乐彩| www.505384.com-博彩王软件手机版| www.580559.com-买不了世界杯彩票| www.657358.com-网上卖彩票-| www.768208.com-如意彩网-| www.857262.com-微微彩票骗局| www.927501.com-彩票数字几位数| www.984964.com-福彩3的走势图| www.dk88.com-广州福彩快三| www.vn72.com-湖南快三开奖走势图| www.13fy.com-大家赢彩票是黑彩吗| www.84pt.com-北控京彩是传销的吗| www.2275.biz-时时彩搭建一条龙| www.8552.org-七星彩前四位缩水软| www.66561.com-信誉平台时时彩| www.025726.com-福彩3d杀号-| www.101182.com-中国彩票投注技巧| www.172164.com-快三彩票投注怎么投| www.278357.com-新快三分析软件| www.365355.cc-广州体彩网点申请| www.458995.com-体彩六加一昨晚开奖| www.548821.com-yy彩票官方-| www.652812.com-重庆时时彩平刷玩法| www.736464.com-上海福彩官方网站| www.810854.com-购彩骗局-| www.882350.com-淘彩吧论坛金算盘| www.975606.com-上官燕最新七星彩| www.cp3131.com-单机游戏快三| www.mg87.com-福泰娱乐快三下载| www.y91.cc-福彩现场开奖| www.56he.com-星彩娱乐是违法的吗| www.0051.top-给我一组彩票号码| www.7746.com-体彩毒胆三天计划| www.25727.com-聚财彩票是不是| www.68013.com-福彩三d开奖详情| www.100425.com-中茗cp533彩票| www.165500.cc-福利彩票发行时间| www.259079.com-竞彩足球比分旧版| www.330838.com-快彩网官网下载安装| www.400947.com-南国七星彩报纸| www.539737.com-中国福利彩票店地址| www.621471.com-9b彩票值得信懒| www.690310.com-赢彩平台-| www.767375.com-一分彩怎么看号| www.872027.com-往期体育彩票结果查| www.951476.com-彩票开奖询-| 网易彩票www.067wy.com| www.ch50.com-吉林省快三开奖遗漏| www.tk58.com-福彩快三浙江| www.56.gg-六冠彩票代理| www.65ik.com-重庆国彩网-| www.0445.cc-推荐大乐透彩票号码| www.9340.loan-阳光彩票官网登陆| www.45291.com-中彩网有哪些| www.90180.com-7彩注册链接| www.046409.com-天天彩票好吗| www.144676.com-唯彩看球app| www.231269.com-百胜快三预测| www.302668.com-南国七星彩图规| www.370315.com-租彩票平台可信吗| www.461974.com-排三彩票专家预测| www.550633.com-买彩票中了1千万| www.666964.com-福彩3d概率法| www.736965.com-上海福彩投注站| www.805286.com-体育彩票排列五规则| www.875629.com-彩易网手机站| www.966792.com-燕赵福彩官网首页| 中彩网www.81233y.com| www.df58.com-中国福利彩快三直播| www.ts51.com-快三平台送彩金| www.9ou.cc-新浪彩票双色球| www.60mn.com-中了福利彩票去哪领| www.936.gg-昨福彩三b开奖结果| www.4609.cc-中彩票无耻亲戚借钱| www.9410.in-非凡网彩票走势图| www.79375.cc-福彩十二选52选五| www.026306.com-三d走势图彩吧助手| www.100824.com-时时彩软件大全| www.161532.com-明发彩票mfa08| www.271156.com-尊彩44app-| www.347887.com-七乐彩骗局-| www.416646.com-彩票销售店怎么样| www.511962.com-总是沉迷彩票| www.574150.cc-福彩3d今天字谜| www.639349.com-够力七彩长条奖表| www.762385.com-87彩店app苹果| www.838502.com-上海长宁快三计划| www.899831.com-83彩票网-| www.960886.com-933cc彩票下载| www.999667.com-蓟彩芝演的电视剧| www.va.cc-快三客软件-| www.lm94.com-人人彩票合法吗| www.b65.top-江西福彩app下载| www.24or.com-六福彩票下载| www.726.win-时时彩个位固定码| www.4239.top-七彩汇电玩下载| www.8899.live-500体彩网-| www.51338.cc-至尊彩快3-| www.89290.com-手机怎么查彩票| www.036703.com-彩票榜cpbapp| www.131386.com-信阳结婚彩礼多少| www.199079.com-体彩十一选五遗漏| www.263835.com-柬埔寨5分彩走势图| www.359863.com-中华彩票9149| www.434040.com-贵州彩民5000万| www.517655.com-90彩票合法吗| www.577864.com-佛山体育彩票| www.638403.com-竞彩网点销量排行榜| www.804544.com-彩票代购-| www.869123.com-七星彩买-| www.954615.com-足彩有世界杯吗| www.988954.com-体彩选号缩水软件| www.cp903.com-百姓彩票注册| www.it73.com-买体彩app哪个好| www.xm66.com-体彩十一选五预测| www.09wq.com-体彩几点封机| www.66yi.com-云南福彩20选八| www.936.cx-双双双色球彩票玩法| www.8195.loan-49cc彩票集团| www.22748.com-广东体彩中心电话| www.57815.cc-福彩乐透安卓| www.020077.com-中彩网三地推荐号码| www.079942.com-彩票行业最新消息| www.203389.com-快乐彩作弊-| www.277033.com-高频彩票坑了多少人| www.380792.com-11选五彩票开奖| www.486300.cc-足彩五串一推荐| www.551051.com-如何线上买福利彩票| www.628400.com-557彩票邀请码| www.684760.com-彩票投几倍什么意思| www.751614.com-彩票机选中奖几率| www.805981.com-湖北快三追号计划表| www.870363.com-跟导师买彩票骗局| www.962542.com-福彩3d最好软件| www.997793.com-彩票天天乐下载| www.cp0358.com-上海快三跨度图| www.ij14.com-3d福彩之家首页| www.wg66.com-旧版360彩票| www.88.org-下载彩票彩吧助手| www.52rq.com-如意彩票网官方端口| www.285.in-今期七星彩结果| www.2525.tv-上彩票官网-| www.6995.biz-下载七彩够力| www.09822.com-齐鲁风七乐彩玩法| www.65593.cc-手机彩票选号app| www.611469.com-长春福彩3d开奖号| www.7666.wang-彩城彩票是真的吗| www.564659.com-河南快三走势图新闻| www.jj57.com-彩客站8位邀请码| www.xl32.com-鑫彩网提现靠谱吗|