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.445636.com-有哪些平台在卖彩票| www.609050.com-分分彩后三后二杀号| www.699259.com-重庆时乐彩注册| www.790688.com-武汉市福利彩票发行| www.875848.com-重庆时彩小窍门| www.947767.com-台湾彩票历史开奖| 中彩网www.61233m.com| www.id07.com-333彩票有危险嘛| www.e96.top-体育彩票现场直播| www.43si.com-出彩的同义词| www.917.in-买彩票秘诀-| www.6022.biz-打彩票欠钱-| www.19028.com-皇帝彩票娱乐| www.67835.cc-网络黑彩票-| www.118780.com-众彩之家下载安装| www.200027.com-体彩开奖公告| www.280405.com-足彩竞彩网法甲积分| www.397345.com-盈众彩票网-| www.527517.com-重庆时时彩振幅讲解| www.632159.com-竞彩足球收米| www.700036.com-五分时时彩软件下载| www.775821.com-彩票无神计划团队| www.892862.com-快三拖码全中| www.960065.com-彩票注册送15| 杏彩www.00840l.com| www.go79.com-好彩双爆珠一条几包| www.zw06.com-建盏七彩如何养成| www.34dr.com-博彩首存送彩金| www.1587.com-彩图宝典-| www.8547.cm-福彩游戏厅下载| www.44287.cc-娱乐彩票app大全| www.93389.cc-千万彩票得主死亡| www.059758.com-3d福彩组三怎么玩| www.170992.com-长春快三开走势图| www.268306.com-彩吧网3d-| www.359876.com-新粤彩玄机图| www.454575.com-乐彩国际可以提现吗| www.551755.com-晨兴彩票登录| www.660982.com-篮球竞彩专家预测| www.756679.com-3彩短外套羽绒| www.839070.com-体育路体彩中心地址| www.912632.com-天干地支如何彩票| www.970656.com-鼓励彩票-| www.mm64.com-排列三试机号彩宝网| www.v46.site-排列三众彩网今天| www.63oh.com-hk百彩网址-| www.0906.mobi-福利彩票篮球杀号| www.9440.loan-14场胜负彩一等奖| www.52272.com-粤淘彩票购票厅| www.97710.com-香港时时彩计划网| www.066176.com-彩票免费领彩金论坛| www.136042.com-梦想网彩票-| www.217290.com-彩票中奖有技巧| www.294987.com-快乐彩票平台注册| www.367765.com-买重号彩票-| www.464318.com-风飞扬七星彩预测| www.554500.com-买彩票亏了可以退吗| www.640351.com-两分彩开奖号码| www.905481.com-嬴彩天下与你伺行| www.971541.com-快捷彩票合法吗| www.c4.cm-快三买大小赔多少| www.of54.com-玩快三输了12万| www.7fr.com-彩票祝福语大全| www.65vu.com-乐彩城平台网址| www.0919.org-福彩3d追号划算吗| www.9039.vip-正规秒秒彩平台| www.46224.com-河南福彩快三| www.91992.cc-丰彩中一百万| www.053178.com-0500彩票下载| www.157023.com-91竞彩之家app| www.244654.com-易彩票是不是骗局| www.318045.com-中国福彩兑奖规则| www.388348.com-华华彩是什么机构| www.533102.com-网易体彩开奖直播| www.615890.com-哈尔滨福彩兑奖地址| www.687679.com-彩票平刷方法| www.765462.com-七星彩高手交流坛伦| www.874148.com-福彩3d布衣天下一| www.953275.com-竞彩网篮球开奖结果| 世彩堂www.5854o.cc| www.dl43.com-体彩竞彩玩法介绍| www.uz27.com-人人国际彩票代理| www.08mt.com-福利彩票历史对比器| www.77en.com-福利彩票中奖扣税| www.1437.xyz-豪亨博5k彩票| www.09069.com-933彩票苹果版| www.52483.cc-唯彩看球app下载| www.96669.cc-彩票网站兼职| www.057768.com-黑龙江牡丹快三| www.170252.com-上海快三彩票| www.254813.com-好彩网论坛实力三肖| www.325901.com-排列3彩经网走势图| www.395285.com-昨天晚上福彩| www.535692.com-美国彩票兑奖| www.616348.com-银银彩彩票-| www.685570.com-七乐彩定胆最新技巧| www.763798.com-足彩加ios下载| www.871534.com-彩票用什么软件好| www.947038.com-北京体彩店-| www.994353.com-体育彩票兑奖查询| www.gd.com-竞彩网计算器| www.mp06.com-送彩金棋牌-| www.x10.com-大发时时彩邀请码| www.50uf.com-足彩复式过滤| www.717.cx-彩票兼职被骗了咋办| www.4422.me-金祥彩票网开奖直播| www.9523.com-手机彩票软件计划| www.72120.com-富搏彩票-| www.028425.com-新博瑞彩票正规吗| www.101523.com-腾讯彩票竞猜补偿| www.165665.com-1068官网彩票| www.268150.com-快彩荐号专家下载| www.350809.com-高频彩最全的网站| www.425685.com-北京时时彩规律大全| www.519785.com-时时彩推波高手改版| www.586676.com-去彩票店买彩票尴尬| www.656446.com-k彩怎么进不去了| www.784198.com-乐彩娱乐是真的假的| www.854920.com-全民彩票投注网站| www.914288.com-手机赚钱彩票| www.971715.com-玩彩票手机软件| www.vw27.com-网上彩票都停售了吗| www.07kv.com-上上期彩票中奖号码| www.74ay.com-彩票是怎么做代理的| www.0971.in-360彩票查询结果| www.8485.me-北京个人彩票店转让| www.35587.cc-超级彩票助手电脑版| www.76207.com-温州福利彩票官网| www.022762.com-海南排列五私彩玩法| www.088554.com-众盈娱乐五分快三| www.147569.com-d8彩票官网-| www.270323.com-九龙彩票-| www.348289.com-乐彩网专家怎么样| www.418822.com-竞彩店兑奖额度| www.511734.com-好用的足彩外围| www.573369.com-福利彩票一月利润| www.636470.com-彩虹4无人机参数| www.759623.com-安徽省福彩领奖地址| www.837368.com-聚彩51app大发| www.895652.com-四场进球彩对阵表| www.956245.com-彩票全国联销| 中彩www.zcwf5.com| www.ak07.com-七星彩现场直播| www.pm85.com-668彩票网下载| www.00kc.com-福利彩票开奖的依据| www.61vj.com-福彩排列三今天预测| www.868.cc-环彩网网页版登陆| www.4312.xyz-nba预测篮彩| www.8863.me-彩票本科专业| www.60215.com-快三秒胶水怎么去除| www.009121.com-重庆时彩走势图| www.068100.com-彩名堂手机版| www.126419.com-创彩网真的能赚钱么| www.188983.com-福彩3d首页-| www.252025.com-送彩金100可提款| www.311596.com-陇南福彩中心地址| www.370376.com-租彩票网站-| www.447968.com-双色球彩币预测免费| www.527230.com-永旺彩票直播网| www.678691.com-注册送c彩金58元| www.741111.com-体彩好还是福彩好| www.804007.com-易彩时时彩计划软件| www.869036.com-北京快三贴吧| www.975670.com-正规网上买彩app|