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天

知道了
9彩注册 www.619739.com-3d彩票怎么学| www.778302.com-官方彩gz-| www.866813.com-博友彩下载-| www.940235.com-吉林快三公司地址| www.997556.com-糖果彩螽鸣虫| www.av89.com-护理彩票5d-| www.854866.com-极速快三吧-| www.950342.com-金龙彩票安全吗| www.4570.org-卖彩票的自己买吗| www.6623.org-双彩是什么意思| www.002294.com-福彩3d复试玩法| www.135780.com-招彩票员-| www.327125.com-彩票里什么叫龙| www.490072.com-福利彩票经验技巧| www.91uj.com-网上彩票代玩兼职| www.5604.cc-体育博彩论-| www.34918.com-快乐彩任选三预测| www.185253.com-彩65app-| www.299566.cc-123彩票网站| www.405559.com-七星彩选号顺口溜| www.529230.com-彩宝贝彩票专家原创| www.671896.com-特彩吧金彩网| www.771128.com-时时彩精选-| www.864538.com-三d彩票每天开机号| www.947503.com-今日福彩3d双彩图| 快彩www.81678p.com| www.li25.com-3号彩票app下载| www.l18.club-福彩排列七开奖号码| www.52of.com-全球足彩预测网站| www.2072.net-旺彩11选5下栽| www.22319.com-有彩礼没陪嫁| www.66282.cc-官方老时时彩走势图| www.075112.com-兼职瑞彩祥云可以吗| www.180764.com-天天彩票app| www.253430.com-大发时时彩计划交流| www.325646.com-六和合彩网站王中王| www.454410.com-网易彩票电脑版官网| www.215583.com-快三加盟官网| www.356034.com-彩票止损是什么意思| www.483505.com-福彩3d乐彩谜语| www.567936.com-迅盈彩票注册邀请码| www.636158.com-彩虹4无人机发动机| www.702132.com-彩票店转让被骗| www.775270.com-103彩票下载安装| www.907068.com-那种彩票六位数| www.968403.com-美国时时彩开奖号码| www.cai3907.com湖北快三玩法| www.md94.com-安卓版58彩票| www.q37.com-双彩开奖公告| www.51mt.com-王中王彩博网| www.0013.wang-生肖与彩票的关系| www.9997.bid-567彩票主播| www.58982.com-搜索福彩开奖结果| www.022898.com-中心彩报-| www.276260.com-博彩返水是什么意思| www.523958.com-重庆时时彩十分| www.eh3.com-软件破解彩票| www.qp85.com-pc彩票是是什么| www.17am.com-网上买彩是真的吗| www.560.com-我乐时时彩-| www.5099.biz-广东福利彩票网官网| www.97171.com-国内竞彩足球合法吗| www.090525.com-五分快三规律破解| www.166548.com-快三中奖助手手机版| www.325398.com-百博海南七星彩| www.399499.com-彩票星期三开什么| www.557173.com-现任福利彩票主任| www.621863.com-宁波彩票-| www.731657.com-竞彩足球比赛结果| www.804342.com-彩票封盘是啥意思| www.879823.com-彩票幸运飞艇聊天室| www.113843.com-福彩3d算胆工具| www.195548.com-168彩票官方网站| www.310932.com-乐盈彩票全天计划| www.433453.com-假彩票制作器| www.563541.com-彩票巴士新版下载| www.656445.com-融彩网平台-| www.906117.com-体彩机租赁协议| www.985282.com-728国际彩票官网| www.c3.tv-安徽福彩快三直播| www.sk81.com-重庆福彩网-| www.31xb.com-星期一彩票开那些| www.0659.xyz-福彩有没有分分彩| www.8932.biz-头头博彩体育| www.000220.com-六个彩下载-| www.108046.com-快三彩票辅助器| www.194819.com-代玩彩票兼职群| www.723289.com-广东彩票一等奖| www.846960.com-信阳体彩合买| www.921622.com-如何破译彩票| www.975403.com-七星彩长期包三字现| www.33bp.com-信誉彩票网络平台| www.6570.cn-附近福彩点-| www.31715.com-竞彩足球完整500| www.81500.com-快三中三个多少钱| www.043456.cc-中国广西体育彩票| www.237298.com-浙江体育彩票网页版| www.316201.com-体彩店老板-| www.386825.com-盛彩注册-| www.568071.com-体彩加盟费与利润| www.646399.com-竞彩水位口诀| www.799207.com-香港票彩大全| www.876533.com-甘肃快三早知道| www.982423.com-蜂巢时时彩计划网页| www.cp527.com-国家正规快三网站| www.mt93.com-江苏快三的开奖走势| www.11fj.com-彩频相册制作| www.0313.shop-广东体彩发展历史| www.8246.loan-258nba竞彩-| www.66195.cc-快乐彩12助手| www.057661.com-打内蒙古快三派彩网| www.140045.com-网上购彩票如何兑奖| www.328896.com-糖果派对送彩金图片| www.433893.com-毕节中彩站-| www.959649.com-好彩票567-| www.to0.com-江苏快三奖金对照表| www.c30.top-彩民福地登陆| www.40bq.com-两元七星彩走势图| www.596.red-亚彩会怎么注册| www.4884.biz-竞彩智能-| www.03191.com-彩票害死人-| www.50330.com-凤凰彩票平台可信吗| www.95570.com-体育彩票公益金比例| www.059775.com-彩票公益-| www.126189.com-亿发彩票官网下载| www.192272.com-好彩3奖金-| www.257234.com-500彩票开挂| www.322383.com-竞彩8串28-| www.383117.com-福彩一定牛-| www.619788.com-奇门测彩票方法研究| www.723501.com-江苏体彩亿元大奖| www.794368.com-黑客植入重庆时时彩| www.863250.com-高频彩票数字原理| www.909941.com-3d彩票规律-| www.959988.com-足彩职业-| www.992151.com-彩票平台注册送18| www.cp430.cc-快三输了回血找我| www.ji99.com-福利彩票天天中奖| www.883807.com-博彩王官方下载| www.988535.com-江西快三投注大厅| www.hq8.com-新内蒙古快三查询| www.qm75.com-神州彩票app网址| www.43ft.com-分分彩八码滚雪球| www.656.website腾讯分分彩高手心得| www.32185.cc-福利彩票双色球贴吧| www.78314.com-福彩信息双色球走图| www.101574.com-足球体育彩票| www.183937.com-河南快三开奖纟结果| www.348764.com-彩宝提现-| www.427178.com-网易体彩大乐透直播| www.962228.com-福彩三d走势图软件| www.ua1.com-手机彩票123下载| www.xy05.cc-千万彩票网址| www.25tp.com-微信彩票国家承认吗| www.41586.com-福利彩票破解| www.146550.com-篮彩实时比分直播| www.713819.com-106福利彩票安卓| www.801098.com-皇都彩票资料| www.868653.com-85彩票网-| www.kp10.com-彩票快三概率| www.e56.club-百度彩票网-| www.5ls.com-常州体彩兑奖地址| www.7171.live-博彩版面-| www.34894.com-福彩3d开奖结果|