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.78pt.com-黑客可以攻击黑彩吗| www.33432.cc-百度福彩3d走势图| www.827698.com-如何查询彩票真伪| www.931907.com-体彩门头-| 金冠彩票www.c4523.com| www.850461.com-有没有人玩快三发财| www.949884.com-炫乐彩票六年实力| 至尊彩票www.156050.com| www.37066.com-江苏快三9购下载| www.028016.com-头奖彩票惊人骗局| www.129196.com-彩虹旗代表什么意思| www.220082.com-五福彩票苹果版| www.300052.cc-手机彩票123| www.375555.com-彩民争霸-| www.487451.com-彩票网站靠什么赚钱| www.571132.com-彩票快三定律| www.649876.com-天牛图库综合彩报| www.782549.com-2元彩票网百度| www.3336.cc-日本全彩本子| www.32993.com-南京市体育彩票领奖| www.331123.com-彩81彩票下载安装| www.481107.com-澳客竞彩开奖结果| www.566824.com-彩虹六号战队皮肤| www.637030.com-红彩网官方首页| www.713230.com-百事彩-| www.789846.com-竞彩过关计算| www.866337.com-体彩屋是合法的吗| www.944499.com-彩票248所有版本| 百姓彩票www.bxcp3.com| www.js63.com-彩神x大发快三| www.3we.com-竞彩对阵身价| www.473440.com-彩票9cb下载| www.160140.com-竞彩胜平负不开售| www.487188.com-竞彩二选一玩法| www.576338.com-红五3b彩报-| www.661624.com-网投分分彩作假| www.753775.com-电信手机余额买彩票| www.921240.com-彩票什么是龙虎呀| www.988594.com-保定体彩中心怎么样| www.ex83.com-快三彩票挂机| www.w85.cn-神彩福牛官方网| www.75id.com-足彩如何跟单能赢| www.4293.biz-虎扑彩票足彩| www.01273.com-胜负彩最新开奖结果| www.86940.com-快三开奖查询今天| www.6019.vip-山东福彩在哪里兑奖| www.882458.com-英国五分彩靠谱吗| www.fr73.com-uu快三怎么玩稳赚| www.02fq.com-彩票k线图如何看| www.0319.date-彩票平台在线抢红包| www.1237.site-七乐彩票机选号| www.7179.in-菲律宾博彩| www.9683.cn-六会彩资料查看| www.080618.com-南洋彩怎么查| www.285239.com-彩票跨度打法| www.111420.com-五福彩票是真是假| www.92vj.com-高频彩必输-| www.4341.top-湖南福彩报最新版| www.11673.cc-彩乐网计划app| www.70383.com-奔驰彩软件-| www.22263.cc-五分彩彩票计划网| www.67630.com-斯诺克博彩app| www.834219.com-好彩香烟双爆| www.915653.com-彩票到哪里加盟| www.984784.com-鼎盛彩票手机登录| www.zk6.cc-5d彩票开奖结果| www.25xr.com-迷彩虎历史军事| www.96pm.com-乐搏彩票-| www.592387.com-彩99官网安卓下载| www.672019.com-福彩三d双彩字谜| www.765126.com-彩票平台排行榜黑彩| www.839063.com-微彩娱乐登录网址| www.915250.com-手机挂机软件彩票| www.976337.com-河南安阳彩礼多少| www.17eo.com-俩夫妻想象中彩票| www.369.space-迷彩虎军情app| www.sj02.com-时时彩总是输却上瘾| www.974391.com-彩虹旗泡弟论坛台湾| www.75572.cc-玩江苏快三-| www.604958.com-体彩顶呱刮规则| www.678846.com-足彩购买大厅| www.765191.com-足彩怎么玩求详解| www.aj17.com-福彩林竹杀码今天| www.50684.com-博彩33app平台| www.056907.com-快乐彩票手机app| www.127864.com-彩虹哥lol-| www.188774.com-内蒙古福彩app| www.257989.com-彩先知10码10码| www.673596.com-深圳体彩投诉电话| www.774780.com-黄金8彩票网可靠吗| www.869607.com-鸿运彩彩票可靠吗| www.941237.com-彩票漏洞套利| www.992028.com-福彩几种玩法| www.bt55.com-派彩网手机版| www.uf10.com-褔利彩票-| www.87lg.com-500彩神邀请码| www.2386.vip-台湾分分彩开奖网| www.897904.com-彩票店荧光板宣传语| www.659.red-微信关注看快三| www.855033.com-伊雪缘足彩比分直播| www.uc2.com-彩票数据分析软件| www.19226.cc-没身份证能彩票兑奖| www.74055.com-中国彩吧3d开奖号| www.031745.com-下彩app-| www.129613.com-大乐透众彩网| www.240618.com-福彩计划app| www.716139.com-宝马彩票真的吗| www.324217.com-球彩台app-| www.680963.com-海南七星彩诈骗新闻| www.077082.com-体育彩票买世界杯| www.144089.com-竞彩赚金被关停| www.211090.com-天下彩免费资料综| www.268235.com-668彩票网真实吗| www.326808.com-中了七星彩怎么领奖| www.390482.com-网络时时彩怎么报警| 新盈彩www.xinyc5.com| www.076605.com-体彩61开奖结果| www.172539.com-吉林快三开奖助手| www.543911.com-福彩3d陈华论坛| www.618537.com-全国各地彩礼价格图| www.700141.com-福少时时彩趋势软件| www.780630.com-评论赢彩彩票| www.856787.cc-福彩今天中奖号| www.qd02.com-彩票销量下滑| www.65ti.com-福彩023期中奖号| www.5724.vip-入赘妻主多彩蒲香| www.37763.cc-7彩网彩票是真的吗| www.083377.com-私彩平台app| www.164205.com-乐优彩票官方版下载| www.234784.com-《中彩那天》课文| www.299705.com-彩客网彩票官网| www.83543.com-大数据彩票下载安装| www.059016.com-篮彩比分直播新浪| www.3830.biz-福彩3d小熊猫图迷| www.135796.com-彩票打票员招聘信息| www.223337.com-一分快三投注下载| www.300022.cc-福彩手机购彩软件| www.113033.com-大众国际大众彩票| www.254983.com-大发时时彩作弊软件| www.3408.vip-可以追号的彩票软件| www.237834.com-湖南福彩动物总动员| www.953147.com-好彩1生肖怎么玩| www.1308.in-上海体彩爱彩乐| www.761786.com-山东省体彩中心电话| www.c89.com-国民彩票下载| www.603.me-香港福彩冂户网址| www.16008.com-天天彩选4开奖号码| www.017736.com-想开家福利彩票店| www.167774.com-福彩快三规则| www.318497.com-时时彩沫沫计划| www.eq02.com-河北快三开奖结| www.19eo.com-男子借钱买彩票| www.947214.com-买彩票要不要身份证| www.0001.name-彩票五位数什么彩票| www.198493.com-七乐彩快三-| www.353769.com-凤凰彩票是真实的吗| www.41zl.com-诚信彩票下载| www.56499.cc-西红柿首富结尾彩蛋| www.129226.com-福彩3d幸运鑫预测| www.130104.com-彩234彩票-| www.8972.shop-国彩过滤单怎么买| www.s82.club-彩民中奖三天没睡觉| www.255850.com-福彩3走势图表| www.105411.com-福彩3晒票详情|