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.7359.top-各地区快三开奖结果| www.908957.com-彩神2怎么玩| www.993372.com-5分彩开奖-| www.bt37.com-彩票挂机软件平台| www.wd74.com-东北快三查询| www.30pq.com-足彩复式投注表| www.388.pw-易赢彩票会不会跑路| www.nd43.com-中彩手彩票合法吗| www.26dd.com-百万发平台时时彩| www.75055.com-体彩刮刮乐5元种类| www.547618.com-彩票托是怎么回事| www.985097.com-福利彩8苹果手机版| www.ei52.com-广西快三预测开奖| www.5nb.cc-胜负彩交税-| www.657073.com-万豪福彩1.4.2| www.818260.com-彩票双色球领奖流程| www.902398.com-正常彩票站有黑彩吗| www.972956.com-好运彩注册-| www.as43.com-福彩基诺奖励规则| www.778483.com-澳洲三分彩怎么玩| www.888089.com-福利彩票邀请码| www.972521.com-水溶性彩铅画星空鹿| www.cai8955.com河北快三实时开奖| www.um88.com-彩宝网3d杀号定胆| www.58xt.cc-ps炫彩字体-| www.1256.vip-分分彩中三单式| www.8014.vip-快乐彩软件下载| www.29371.cc-欧冠购彩万博d| www.365219.cc-玩广西快三怎么戒赌| www.560255.com-河北快三派彩走势图| www.678529.com-我要下载彩99旧版| www.797938.com-易彩乐官网-| www.924981.com-彩票计划软件赢彩| www.998009.com-福彩单双-| www.j50.net-蚂蚁彩票合法吗| www.447588.com-足彩手机怎么买彩票| www.609711.com-6288彩票-| www.702656.com-盛澳竞彩是真的吗| www.787288.com-福建体彩即乐彩| www.066466.cc-玩彩票大平台怎么样| www.546.bid-五分彩网址-| www.069220.com-彩神iv怎么打不开| www.462209.com-彩票规则漏洞| www.549198.com-竞彩篮球竞彩网| www.657030.com-七星彩与93彩票网| www.727004.com-彩票赚佣金-| www.862847.com-体育彩票16期结果| www.655687.com-彩富网址-| www.737021.com-上海中国福利彩票| www.829676.com-福彩3d通选好中吗| www.905539.com-足彩世界杯-| www.974101.com-亿博彩票1分彩计划| www.cai127.com-贵州快三开奖结果| www.rj95.com-各种釉彩大瓶赏析| www.78.cn-用彩虹写一段话| www.70dw.com-彩票贪-| www.1924.org-申请竞彩店的要求| www.7269.org-满堂彩登app下载| www.21214.com-中国体育彩票竞猜网| www.g01.top-双色球彩票兑奖期限| www.0580.bid-福彩3d图迷第一版| www.584562.com-捕鱼送彩金能退钱| www.729411.com-有玩快三的微信群吗| www.802780.com-福彩总部电话号码| www.871276.com-天天赢彩票注册地址| www.932692.com-四季彩官方下载| www.987703.com-038彩票作弊案| www.bo32.com-手机68彩票-| www.yb30.com-属羊买彩票用什么号| www.28pi.com-乐彩彩票网网址| www.752.website黑彩平刷-| www.gf62.com-网上快三彩票合法吗| www.496170.com-足彩西西-| www.643355.com-无锡福利彩票| www.717098.com-彩铅牌子排行榜| www.791074.com-广西福彩中心兑奖| www.861069.com-新彩吧网手机板| www.928588.com-约彩365店主版| www.981333.com-中彩网媒体擂台赛| www.cp3307.com-一分快三就是坑| www.mv81.com-新开彩票站的忠告| www.144368.com-胜负彩14场对阵表| www.857867.com-大庆彩票中奖| www.942210.com-体彩佣金几号发| PK彩票www.8499b.com| www.xk60.com-澳洲彩票计划软件| www.485386.com-篮球彩票分析群| www.7707.pw-江苏快三有规律么| www.978844.com-36好彩一预测| www.hr20.com-足彩北京单场竞猜| www.865998.com-彩票6491-| www.930998.com-天天中彩票多乐快三| www.983867.com-福彩一等奖兑奖流程| www.cg9.com-北京快三和值规律| www.365213.cc-时彩诈骗-| www.510613.com-彩票2019-| www.602328.com-中国福彩游戏厅| www.675511.com-中国体彩开结果| www.746702.com-天天爰彩彩票| www.817794.com-陆慧明竞彩分析| www.891641.com-彩票统计表怎么做| www.277792.com-997彩票下载| www.cp768.cc-恒博快三网-| www.yj15.com-安徽福利彩票计算器| www.03ig.com-现金彩票app官网| www.762397.com-87彩店app停用| www.818319.com-搜狐彩票网好不好| www.876614.cc-红牛彩票真假问题| www.930918.com-海南七星彩解梦| www.974854.com-南京体育彩票网| www.jw50.com-福彩开机号查询| www.ij66.com-正版福利彩票软件| 大赢家彩票www.578411.com| www.7608.vip-体育彩票赔率| www.874710.com-北京快三还有半顺吗| www.3104.net-体彩专管员-| www.277848.com-我爱彩票首页| www.779003.com-彩票假球案-| www.731647.com-彩票五等奖-| www.951655.com-一定牛体育彩票下载| 快彩www.81678u.com| www.470761.com-足彩老是输-| www.551105.com-彩票站合买-| www.650326.com-托班彩虹伞游戏玩法| www.714009.com-老柳玩福彩3d| www.789012.com-唯彩网下载-| www.844803.com-什么是福彩初创期| www.894188.com-779彩票骗局| www.947995.com-四川福彩中心| www.984327.com-体彩助手登录不了| www.cp161.com-江苏快三是什么平台| www.14lf.com-掌中彩app下载| www.613.cm-时时彩手机版| www.681569.com-豪彩娱乐下载链接| www.812475.com-体彩中奖诀窍| www.886264.com-卡通彩铅画图片大全| www.77952.com-二手彩神喷绘机| www.933386.com-地区快三是正规的吗| www.990177.com-体彩排列三3走势图| www.cs69.com-快三app正规平台| www.998811.com-香港三色彩票| www.gz33.com-盈彩在线属于诈骗吗| www.245363.com-易彩快三下载| www.365408.cc-今曰彩票开奖号码| www.448811.com-彩票今日开奖查询| www.850403.com-足彩5串16玩法| www.916211.com-网上彩票平台是犯法| www.966973.com-体育彩票重启| E彩堂www.9818w.cc| www.28464.com-腾讯分分彩群的套路| www.8387.top-打彩是什么意思| www.940.cc-大星彩票混合图| www.111976.com-fatego彩圈-| www.185113.com-官方彩1分快3| www.506765.com-竟彩单场混串玩法| www.567060.com-彩虹图画-| www.624808.com-uu彩票怎么提现| www.681804.com-黑龙江体彩22选5| www.743988.com-87彩票网站-| www.799944.com-福彩双色球现场直播| www.857213.com-恒彩测试88-| www.897736.com-多彩贵州普安县网| www.954983.com-辽宁福彩3d字谜| www.991250.com-河北福彩中心网|