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天

知道了
500彩票竞猜 www.810992.com-头奖彩票网官网客服| www.58952.cc-35cc天空彩-| www.051523.com-赢彩吧注册-| www.138668.cc-互娱彩票返点| www.219642.com-彩吧网-| www.305072.com-彩票投注客户端下载| www.378652.com-广西快彩开奖结果| www.598026.com-足彩十四场最快开奖| www.679629.com-太阳彩票app下载| www.767827.com-网投彩票平台哪个好| www.894338.com-685彩票-| www.970154.com-玩运彩即时比分| www.wx28.com-湖北竞彩快三查询| www.27hp.com-重庆时时彩有漏洞吗| www.884.tv-极速快三公式| www.5680.vip-龙胜国际彩票是什么| www.15484.com-6加1彩票开奖时间| www.68231.cc-重庆彩票投注网| www.072055.com-小店宝彩票中了| www.145943.com-567彩票安全吗| www.255042.com-新时时彩助手下载| www.335572.com-2017彩票弃奖| www.421977.com-广西福彩网快乐十分| www.530060.com-铁公鸡彩票下载| www.656108.com-500彩票无限包赔| www.752903.com-app好彩票-| www.849293.com-竞彩首页网-| www.922503.com-怎么当足彩分析师| www.985334.com-足彩分析app推荐| www.gr92.com-成功彩票-| www.zk69.com-ios彩票-| www.30un.com-周五那个彩票开奖| www.0518.wang-福彩刮刮乐中大奖| www.7577.cm-足彩外围玩法术语| www.27518.com-山东体彩论坛排列五| www.73522.com-体彩19054-| www.031897.com-彩票中奖哪期兑奖| www.113250.com-彩票奖金计算方法| www.188396.com-内蒙体彩11选五| www.266799.com-快三平台属于赌博吗| www.440989.com-体彩兑奖地点不同| www.539574.com-时时彩输改赢| www.638831.com-福彩中心宗旨| www.731051.com-全球彩票官网下载| www.807822.com-开户送彩金棋牌娱乐| www.884295.com-杏彩网页登陆首页| www.980322.com-27彩票-| www.ed9.com-中彩网官网-| www.pv31.com-长城彩票是真是假| www.03we.com-首次注册送彩金| www.77nn.com-掌上福彩宝典官网| www.1753.com-万彩影像大师免费版| www.9937.loan-订婚的钱算彩礼钱吗| www.56221.cc-彩票中一个数有奖吗| www.004208.com-福彩布天下图| www.078832.com-六合牛娃彩票| www.144432.com-今日快三湖北| www.270358.com-7彩图片-| www.358901.com-快三三同号最大遗漏| www.447955.com-今日老黄历买彩票| www.540280.com-重庆时时彩机选一注| www.652888.com-七星彩吹吹圏| www.739076.com-中国足彩竞彩网首页| www.815255.com-国彩app真能赚吗| www.887236.com-选三型彩票中奖揭秘| www.980969.com-凤凰vip彩种| www.ck5.com-分分时时彩计划| www.op64.com-网购彩票app| www.9cp.cc-数字0到9彩票| www.69ec.com-彩宝网主页-| www.0971.biz-彩票倍投方式| www.8903.top-射阳城西体育竞彩店| www.78526.com-解太湖双彩网| www.029805.com-内蒙福利彩票app| www.106918.com-瑞彩祥云下载网址| www.176410.com-福彩3d试机号金码| www.438218.com-彩票5等奖多少钱| www.559324.com-中国体育彩网排列五| www.631216.com-福利彩票期数看哪里| www.701238.com-盈盈彩票app| www.777776.cc-鼓励买彩票的话| www.909713.com-乐彩33app-| www.972077.com-湖北体彩假球| www.cp9558.com-下载旺彩安装| www.nj75.com-365足彩网-| www.3pt.com-彩票谁发明-| www.58tl.com-三分彩走势图怎样看| www.0110.loan-哪种彩票天天开奖| www.7988.cc-博彩堂天下彩| www.26242.com-彩神vapp安全吗| www.67726.com-彩票网上犯法吗| www.040701.com-八八彩票登录| www.127810.com-798彩票网-| www.198444.com-大发五分快三计划| www.268106.com-时时采彩走势图| www.374369.com-雅安中彩票大奖| www.492234.com-得乐彩票登录| www.562379.com-千美彩票-| www.627306.com-篮球彩票让分规则| www.695868.com-老彩票注册平台| www.771791.com-腾龙时时彩做号官方| www.892938.com-全民彩票官方网| www.957346.com-7星彩开奖结果网易| 500彩票www.50051m.com| www.df00.com-易彩登陆-| www.tm85.com-玩彩老头福彩| www.62.la-9亿彩票是不是骗局| www.64zq.com-全天彩票计划网址| www.0853.date-山东福彩展示柜兑奖| www.00314.com-福利彩票五等奖| www.51798.com-青蛙彩票首页| www.92574.com-江苏体彩足球竞彩| www.048318.com-明发彩票坑人| www.209467.com-9万彩票安卓版| www.280542.com-体彩开奖直播网易| www.371849.com-体育彩票店主群| www.dr5.cc-吉首商业城快三秒| www.mz72.com-保定彩票站转让| www.x10.cc-彩票微信交流群| www.47ln.com-南宁体彩中心在哪里| www.550.in-七乐彩开獎号| www.3809.in-周公解梦七星彩查询| www.8875.net-足球竞彩8串8| www.65968.cc-下彩触屏版-| www.020329.com-快三定胆方法| www.085512.com-红牛彩票是否真实| www.141037.com-福彩3数字开奖号码| www.211287.com-福州快三开奖结果| www.276363.com-广西快三综合走势| www.386613.com-台湾威力彩-| www.513046.com-彩票投注站微信代购| www.577572.com-七星彩开奖预测宝贝| www.641111.com-荣誉彩票是骗局吗| www.741102.com-福彩有哪些类型| www.805080.com-竞彩为什么不开中超| www.873545.com-35彩票下载-| www.970263.com-彩票单带-| www.is55.com-六彩票吧-| www.yb77.com-天津体彩中心| www.13ka.com-彩裤宝典最新开奖| www.74he.com-今日体彩怪字神贴| www.0673.vip-彩票店盈利模式| www.8657.top-亚博彩票网址| www.34788.com-彩神喷绘机价格| www.73289.com-有没有彩票计划群| www.034937.com-网上有几个彩票平台| www.560308.com-七彩论坛-| www.622730.com-临泽彩票中奖| www.714087.com-时时彩高手技术分享| www.783369.com-3d福彩藏机图正板| www.849681.com-分分彩对应公式| www.904744.com-免费买彩票-| www.962548.com-中彩票全天计划| 500彩票网www.61655f.com| www.115164.com-彩色混凝土压模| www.771619.com-虹口竞彩网点查询| www.06052.com-福利彩票3d论坛| www.585297.com-e财通彩票-| www.652381.com-澳门博彩讨论qq群| www.739453.com-好彩网址-| www.800402.com-网络彩票作弊器| www.858470.com-秒彩票开奖-| www.901346.com-菩萨赐彩票-| www.954876.com-竞彩足球中国足彩网|