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天

知道了
全红彩票 www.033986.com-七乐彩票真的吗| www.456749.com-彩票提示标语| www.626997.com-体育彩票什么时候开| www.59137.com-香港福彩门户网站| www.fw43.com-彩票托朋友圈| www.js60.cc-彩神x是不是骗人的| www.4486.cn-竞彩足球直播500| www.9227.cm-最新阳光探码彩民乐| www.4145.xyz-彩虹六号墨冰值钱吗| www.9680.vip-手机彩宝网app| www.596533.com-福彩3d是多倍数| www.715958.com-中彩时时彩娱乐软件| www.822776.com-牛彩网3dp3-| www.933329.com-快三最长的龙| www.20er.com-19022期胜负彩| www.922761.com-欧莱雅彩妆店| www.695768.com-足彩竞彩官方下载| www.841787.com-中国福利彩票销售点| www.947914.com-福利彩票代打兼职| www.31du.com-南京开体彩店| www.942264.com-彩96注册官网| www.226791.com-快三是合法的么| www.232307.com-江苏快三中奖| www.507825.com-九州彩票如何| www.677336.com-章鱼彩票独家| www.0112.cc-彩票方面-| www.608086.com-有飞鱼体彩么| www.751649.com-彩鸿彩票-| www.833825.com-3d天天中彩吧字谜| www.36526.cc-福彩大全-| www.1887.pw-福彩3d之家藏机图| www.33078.cc-极速时时彩开奖列表| www.89903.com-七彩视界ios| www.09nv.com-福建体彩飘雪聊| www.166109.com-贵州快3彩票开奖| www.595227.com-3d杀尾大全牛彩网| www.264988.com-快三算赌博吗| www.387180.com-尼彩手机大全| www.518268.com-炫彩铃声ios| www.627880.com-内蒙快三开奖时间| www.670773.com-福彩双色球预测号| www.890704.com-彩票倾家荡产| www.cai220.cc-快三助手中奖宝典| www.769048.com-好彩网是真是假| www.008783.com-彩票源码下期开奖| www.86op.com-阿狸彩票app| www.9192.online新加坡彩票几点关门| www.023194.com-香港正版蓝彩| www.023706.com-网购彩票私彩风险| www.144272.com-728国际彩票官网| www.279385.com-腾讯分分彩破解软件| www.077553.com-鸿彩彩票是真的吗| www.789434.com-三弟彩票图-| www.986468.com-彩票33软件安卓版| www.16999.com-买彩票算不算投资| www.ly39.com-福彩61生肖-| www.5978.space-乐彩票论坛-| www.953451.com-昨天彩票开奖| www.138558.com-万达时时彩平台注册| www.335845.com-购买体育彩票| www.500330.com-222彩票网-| www.658937.com-七星彩最神奇连号| www.862130.com-彩客彩票网官方端口| www.954327.com-排三彩票网-| www.1bg.com-彩票冷热什么意思| www.766.in-时时彩开挂器| www.7162.biz-哪种彩宝更畅销| www.26055.com-体育彩票足球五串一| www.70735.com-安徽快三开好规律| www.89536.com-新彩网站梅子手机网| www.911481.com-彩票51破解版| www.989632.com-彩民乐钱树图| www.hi31.com-买湖北快三的软件| www.yh35.com-大发快三辅助工具| www.14nv.com-7星彩开奖历史记录| www.2045.vip-广东福彩双色球买法| www.171279.com-河北快三二同号推荐| www.37185.cc-好运彩怎么下载| www.296356.com-江苏快三如人工计划| www.382910.com-体彩16号开奖结果| www.52pz.cc-悉尼快5彩票算法| www.327186.com-49彩票官方网站| www.613007.com-中国体育七彩乐开奖| www.x46.me-艺龙彩票-| www.126481.com-王者彩票2-| www.922339.com-彩八在线-| www.ek39.com-好彩网牛彩-| www.8qy.com-彩运来注册-| www.91dm.com-31体彩开奖-| www.095129.com-大奖网彩票触屏版| www.6920.org-七彩云南的含义| www.59255.com-ai足彩预测-| www.562110.com-十大彩票平台有哪些| www.662095.com-中国福利彩票手机| www.825608.com-拉萨快三查询| www.960041.com-福彩快三长龙助手| www.8cs.cc-a8彩票官网-| www.57929.com-汇彩网邀请码有没| www.954349.com-大红鹰彩票登录网站| 彩71www.915422.com| www.rx50.com-福彩网上投注站官网| www.lm1.com-彩票app排行榜| www.zz32.cc-上海开福彩店| www.41di.com-体彩大乐透春节休市| www.2836.vip-常平彩乐糖果厂| www.803666.com-彩票软件8816| www.919926.com-国外彩票网站出租| www.981203.com-七彩冰淇淋做法| www.83ct.com-为他人喝彩-| www.403210.com-七星彩前四计划| www.539051.com-什么人容易中彩票| www.83nf.com-预测黑彩-| www.wf0.cc-七星彩专家预测最准| www.7255.com-妖刀姬43内彩| www.671496.com-十一万八彩礼寓意| www.325675.com-大发快三作弊器官网| www.521388.com-时时彩停了吗| www.660698.com-澳彩网下载-| www.865622.com-福利彩票站怎么加盟| www.cai2348.com福彩快3湖北| www.xu42.com-彩票送礼金-| www.67br.com-幸运分分彩论坛| www.930806.com-体彩公式-| www.525582.com-时时彩计划导师群| www.cai0789.com北京快三遗漏| www.c45.org-彩票306苹果版| www.446.net-福乐彩平台正规吗| www.v66.net-摘彩网牛材网| www.49743.com-玩彩网是真的吗| www.171804.com-贵州体育彩票官网| www.678472.com-121七星彩走势图| www.389288.com-七乐彩预测分析专区| www.17934.com-福彩官网首页提前开| www.979314.com-俄罗斯好彩香烟| www.500894.com-希腊玩什么彩票| www.650659.com-小班美术彩虹伞教案| www.94.cc-澳门十分彩计划| www.ob11.com-北京时时彩是官方| www.1917.me-七星彩梦册查询雷州| www.279286.com-吉林快三能输钱| www.397888.cc-乐彩01下载-| www.544985.com-精彩数学就在身边| www.773467.com-七乐彩福利彩票| www.875121.com-酷彩吧与奖多多| www.32379.cc-彩色印刷包装公司| www.023221.com-极速时时彩开奖网站| www.073751.com-河南快三和值表| www.19622.com-网上买私彩多少犯法| www.687625.com-彩票返利是真的吗| www.82779.com-竞彩足球开奖时间| www.929563.cc-彩16官网下载地址| www.01gh.com-中国彩民彩吧| www.66929.cc-福利彩票点-| www.hw95.com-贵州快三查询| www.118578.com-境外彩票网站大全| www.8677.net-七星彩1956-| www.wq5.cc-湖北快三统计图表| www.713362.com-福彩3d造假-| www.831973.com-彩票网上接单| www.427006.com-彩民周刊报纸答案| www.40946.com-彩拾彩票网址| www.106667.com-竞彩2串1比赛腰斩| www.214941.cc-4亿彩票官网| www.332300.cc-彩票查询快三内蒙|