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.702170.com-505彩票代理| www.312277.com-速八彩票骗局| www.79vf.com-南京鼓楼区彩票| www.tc99.com-七彩色-| www.38eh.com-七星彩2237图规| www.166844.com-快三玩法技巧| www.4700.vip-新浪爱彩购彩大厅| www.385809.com-福利彩票会过期的| www.612341.com-彩票预测书-| www.845895.com-中国彩票作弊人员| www.238005.com-万家彩票官方首页| www.696565.com-陈教授研究彩票的| www.809528.com-全彩助手下载| www.930930.cc-大马彩今天开奖成绩| www.vq59.com-甘肃快三结果今天| www.dj12.cc-福利彩票规则玩法| www.246789.com-风彩-| www.478708.com-永利彩投合法吗| www.835.biz-时时彩平投长期盈利| www.14796.com-彩票大赢家网| www.dq01.com-福彩自助下载苹果版| www.007337.com-开体育彩票店赚钱吗| www.515875.com-金彩网福彩网| www.00411.com-任选3中奖规则福彩| www.31ou.com-羽泉彩虹原版吉他谱| www.52959.cc-黑彩庄家赔还是搛| www.055482.com-好彩彩票app下载| www.198624.com-大发快三彩票解码器| www.770123.com-青海体彩大奖| www.914163.com-ag彩票名站-| www.973063.com-最新彩虹世界安卓| www.586685.com-快三手机计划| www.926810.com-达人彩票网站| www.76ki.com-a23彩票登录| www.775187.com-即开彩票有哪几种| www.bl23.com-彩票两元3d走势图| www.841.me-掌上彩票客户端| www.039584.com-广州东方快三正规吗| www.378955.com-好彩网app网赚| www.885265.com-七星彩中4个号有奖| www.73.win-彩票不让提现怎么办| www.9616.cn-57088胜彩论坛| www.840052.com-福利彩票改变什么| www.948670.com-福利彩票销售额16| www.cai678.com-快三算号神器| www.kj20.com-彩票中奖3d-| www.yc1.cc-财神彩票骗局| www.802204.com-云南省福彩网| www.936906.com-福星彩图-| www.cp860.cc-教你百盈快三怎么玩| www.e37.club-百度福彩123| www.94nj.com-体彩技巧-| www.01490.com-斗牛送彩金-| www.006176.com-福彩快3注册| www.341200.cc-沧州市体彩中心| www.502862.com-福利彩票站怎么提点| www.629756.com-时时彩后二万能8码| www.777084.com-彩77苹果二维码| 网易彩票www.060wy.com| www.219674.com-彩票投注模式| www.413886.com-竞彩复式投注表价格| www.595569.com-彩票店领小奖| www.679226.com-聚彩手机网-| www.773300.com-棋牌送彩金多的网站| www.347658.com-彩虹特殊含义| www.504971.com-彩排的心情说说| www.po93.com-彩票360-| www.67178.com-郑州福彩中心| www.216877.com-快三稳定平台| www.314419.com-海南飞鱼体彩手机版| www.396935.com-福利彩票推荐书籍| www.506644.com-乐彩手机静态版| www.577608.com-彩虹糖有几种颜色| www.640703.com-荣誉彩-| www.731243.com-福彩三d和尾走势图| www.806208.com-福彩今天3d试机号| www.880071.com-福彩独胆专家预测| www.951226.com-京彩挂机能赚钱多| 购彩之家www.gczj9.com| www.ci53.com-快3注册送彩金的| www.000080.com-海南体育彩票4十1| www.78248.com-3d彩票绝密技术| www.368876.com-彩神幸运飞艇全能版| www.561662.com-信彩平台计划软件| www.637275.com-彩虹6号围攻官网| www.712673.com-福彩艳午字谜| www.801064.com-福利彩票多会儿开奖| www.873639.com-彩票计划源码| www.934341.com-彩盈娱乐app| www.986782.com-新浪篮彩比分直播| www.as52.com-体彩排列5开奖号码| www.rz71.com-福建体彩网31选7| www.29956.com-下载全民竟彩彩票| www.586094.com-旧版118彩票| www.796748.com-体彩排列三综合走图| www.878924.com-彩票最稳的投资方法| www.qo00.com-广西快三输了怎么办| www.37rb.com-七乐彩天齐网杀号| www.1097.pw-竞彩5串1-| www.8393.cn-彩票中奖软件生成| www.616555.com-恒彩注册账号| www.447212.com-网络彩票封号跑| www.562959.com-爱米彩的网站| www.666120.com-福彩双色球最新预测| www.091799.com-百万彩票幸运快三| www.560534.com-短信验证送59彩金| www.676925.com-湖北快三追号计算器| www.803006.com-乐彩彩票可信吗| www.903239.com-彩票开奖走势图排五| www.975749.com-太康13万彩礼| www.rc4.com-幸运彩票快三三分彩| www.819720.com-河南省彩票兑奖| www.84zq.com-大发彩票是黑网站| www.7517.biz-体彩怎么申请竞猜| www.993165.com-快三最多能买多少倍| www.9730.in-彩票诈骗举报电话是| www.025826.com-包头福彩中心| www.137989.com-577彩票计划| www.350448.com-陕西福彩十分开奖| www.553304.com-竞彩初赔-| www.820096.com-福利彩票七彩乐时间| www.933529.com-买彩票的app靠谱| www.ii69.com-双彩球-| www.09904.com-齐鲁彩票最近奖是几| www.360074.com-三亚私彩举报电话| www.496402.com-网上代买彩票软件| www.643133.com-304彩票-| www.759822.com-时时彩开奖20分钟| www.860951.com-好彩3玩法介绍| www.983756.com-518彩网app-| www.7rm.cc-彩票六等奖怎么兑奖| www.340481.com-好彩网预测-| www.521424.com-河南幸运彩票开奖| www.589977.com-七星彩基本走势图综| www.123519.com-福彩金吗-| www.199173.com-福彩快3有黑幕| www.759207.com-马来三分彩计划软件| www.962817.com-银河彩票是正版网吗| 500彩票网www.65707w.com| www.jd83.com-福州快三走势图| www.t45.net-福彩3d合买群| www.47645.com-腾讯分分彩稳定玩法| www.103736.com-乐彩网余款可以提现| www.kq5.com-体育彩票快三走势图| www.365340.cc-九九彩票下载安装| www.444854.com-彩票中奖的税率| www.518600.cc-福彩王素英判多少年| www.583752.com-网彩计划-| www.635789.com-正规时时彩投注官网| www.689025.com-彩16彩票服务平台| www.760146.com-六福彩票官方代理| www.811867.com-新昌县双彩乡| www.025057.com-彩乐汇盈利1分快3| www.82xy.com-北京彩民中5.7亿| www.6045.shop-十四场胜负彩直播| www.093433.com-彩票开奖双色球开奖| www.267126.com-彩福足彩-| www.350303.com-福彩3d五行推算| www.959176.com-欧洲彩票巨奖骗局| www.05ol.com-自学彩铅画教材| www.4967.pro-威发彩票官方平台| www.006865.com-河南体育彩票网| www.22tw.com-福彩每天开奖结果| www.86sg.com-热购彩票线路导航|