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天

知道了
彩票256平台 www.013538.com-海南彩票网开奖结果| www.47ug.com-中国移动彩铃官网| www.931661.com-买彩票中奖咒语| www.cai3688.com快3彩票官网下载| www.qd97.com-七号彩票下载| www.46pn.com-彩票买5个数的| www.927.me-临沂体彩网-| www.4465.net-财神时时彩计划软件| www.590048.com-足彩竞彩比分计算器| www.466698.com-七乐彩开机号分析| www.760084.com-68彩票网官方网站| www.650157.com-带玩彩票软件| www.788322.com-19039足彩分析| www.871419.com-彩富网最快报码室| www.965150.com-大发快三单期计划| 博友彩www.962095.com| www.78939.cc-福彩3d解码技巧| www.568602.com-手机赚钱的彩票| www.mj04.com-重庆事实彩开奖结果| www.24.mobi-福建龙岩长汀彩票站| www.126423.com-创彩网真实可靠吗| www.231357.com-体彩大乐透专家推测| www.817806.com-北京快三两码遗漏| www.902310.com-河南福彩官网唯一| www.980022.cc-彩票导航9833| www.2721.pw-福彩3d天齐网| www.8717.biz-诸葛团队35彩票| www.71252.com-天际彩票的邀请码| www.030872.com-彩61靠谱吗-| www.108493.com-买彩票上瘾| www.686808.com-中彩那天生字| www.776172.com-好盈彩票-| www.929957.com-香港竞彩快三查询| www.986165.com-彩票送彩金软件| www.gv7.com-内蒙福彩三的| www.pa72.com-河北福彩3d规则| www.97.me-博大彩票是骗局吗| www.76kj.com-a23彩票网下载| www.1628.cn-送59彩金的是那个| www.331483.com-球彩票走势图大全| www.921169.com-睿智的彩神-| www.978158.com-彩钢板围挡铁皮厚度| www.dq21.com-哪些省份有福彩快三| www.wu20.com-彩票精准缩水软件| www.20bk.com-手机全民彩票安全吗| www.559.win-胜负彩高手-| www.4730.vip-辽宁福彩35选7| www.t00.top-彩票开奖走势规律| www.193992.com-河南快三的台子| www.301380.com-万彩吧资料下载| www.370518.com-中国七星彩直播现场| www.475302.com-彩票平台招人| www.160907.com-五分快三是赌博吗| www.314940.com-彩票怎么样算中奖| www.375252.com-福彩今天开机号| www.wd39.com-快三网投平台| www.629023.com-彩票中奖新闻真实性| www.710214.com-彩票店微信有吗| www.809928.com-赢彩网安全吗| www.881301.com-福彩快三的中奖规则| www.988294.com-江西七乐彩-| www.hd5.cc-安徽快三推荐号| www.om95.com-3d彩吧助手走势图| www.5ci.cc-彩票定胆位计算公式| www.113624.com-猜大小的彩票有哪些| www.219743.com-正规的网络购彩平台| www.298989.com-彩票曲线图怎么看| www.369097.com-七星彩中国彩吧| www.467867.com-七乐彩开奖直播直播| www.6783.me-唯彩双色球预测| www.40470.com-福利彩票双手机投注| www.pj42.cc-彩票要不要加倍| www.55.vip-甘肃快三遗漏图表| www.73jt.com-炫彩皮肤怎么买| www.237119.com-足彩竞彩开奖| www.866390.com-手机福彩投注客户端| www.949073.com-福彩在线刮刮乐| 幸运彩票www.5095y.com| www.fz00.com-举报时时彩在哪举报| www.m65.com-彩票还能做卖点什么| www.946995.com-重庆全天时时彩计划| www.mo0.com-广西快三预测号码| www.sy72.com-福彩快3奖金多少| www.1vq.com-时时彩多少分钟一期| www.122530.com-兼职刷彩金单| www.198670.com-福彩十选五官方网站| www.269092.com-长城彩票大发| www.552324.com-在线购买大乐透彩票| www.783706.com-105彩票首页| www.855667.com-网上购买世界杯彩票| www.905686.com-爱竞彩比分直播| www.967772.com-彩票开奖l结果| www.16ub.com-体育彩票加盟流程| www.84dv.com-彩票系统供应商| www.1688.site-福彩3d布衣2| www.339128.com-ab双平台彩票对冲| www.422885.com-我要下载彩乐乐| www.979719.cc-好彩一开奖结果历中| www.cb66.com-彩51app苹果| www.tt59.cc-彩票合买软件| www.08yz.com-5k彩票网址导航| www.153387.com-重庆时时彩包胆技巧| www.283342.com-彩票数字的周期循环| www.886807.com-c彩61骗局-| www.965111.com-彩票app购买时间| 大赢家彩票网www.83033t.com| www.52332.cc-8k彩票网址-| www.92939.cc-博牛彩票用了多久了| www.046650.com-福利彩票店装修图片| www.144126.com-快乐彩33期-| www.225778.com-5亿彩app-| www.788225.com-中国足彩旧版| www.857307.com-快三概率怎么算| www.915185.com-小米彩票怎么没有了| www.970480.com-分分彩胆码技巧| www.fs79.com-快三怎么猜一个好| www.vf76.com-江苏体彩快十一选五| www.046947.com-51彩虹软件下载| www.133203.com-彩色纸箱加工厂| www.200914.com-福彩三d新彩网| www.263230.com-福彩刮刮卡品种| www.358722.com-七星彩会员网站| www.432396.com-福彩三地最大值走势| www.520721.com-时时彩杀号方法如下| www.cai6783.com极速快三开奖号码| www.46305.com-中奖彩票店有提成吗| www.429034.com-现代创意水彩画图片| www.508335.com-v竞彩-| 500彩票www.50054j.com| www.38293.cc-冀彩宝可信吗| www.396028.com-周一至周日开奖彩票| www.538631.com-彩吧彩报银海版| www.fy64.com-内蒙快三技巧| www.vj61.com-彩票中奖后多久过期| www.034500.com-时时彩程序定制| www.894349.com-福利彩票快乐12| www.967576.com-黑彩能报警吗| www.gc7.cc-彩票的玩法-| www.mt20.com-福利彩票复试玩法| www.201715.cc-押大小单双正规彩票| www.295583.com-上海福彩网官方首页| www.377736.com-中华彩票网站是多少| www.533131.com-澳门6合生肖彩| www.nt48.com-彩票中奖符-| www.u13.bid-时时中彩票助手| www.40yp.com-七星彩作假-| www.0349.cn-彩20下载到手机| www.289987.com-彩库宝典彩图图库| www.375347.com-彩金宏辉平台| www.485088.com-481河南乐彩| www.552937.com-盈彩网官网app| www.653835.com-彩票平台刷流水佣金| www.727597.com-双赢彩票下载| www.34wo.com-财富报七星彩图| www.165977.com-旺彩大乐透推荐| www.765407.com-足彩500万电脑版| www.872321.com-彩票的全部技巧| www.959780.com-3号彩票正规吗| 爱彩乐www.ac9922.com| www.456039.com-手机玩福彩-| www.17el.com-七乐彩头奖-| www.290.tv-2010年七星彩| www.2948.pw-福利彩票素材图片| www.7700.biz-体彩中奖多少要交税|