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.990503.com-优彩网大发快3| www.a32.cc-彩票兑奖查询| www.91hy.com-辉煌彩票手机版| www.86oe.com-go彩刷流水可靠吗| www.ho44.com-足球彩票怎么玩的| www.22pv.com-彩票领奖姿势主任| www.91758.com-500彩票网登录网| www.116889.com-今日足彩比赛结果| www.173988.com-上海快三开奖结果快| www.338070.com-蚂蚁彩票是黑平台吗| www.778940.com-二四六报彩网| www.874154.com-七乐彩开奖结果| www.847619.com-那个彩票软件好| www.930791.com-近期中奖彩民新闻| 天天彩票www.54968f.com| www.130983.com-河南彩礼文件| www.306765.com-教育台直播福彩开奖| www.116626.com-如何成为快三高手| www.281219.com-时时彩遗漏统计| www.00956.com-杀码3d乐彩论| www.zv85.com-七彩建盏价格| www.13hw.com-辽宁体彩十一选五开| www.1190.pro-掌上购彩七天彩提现| www.269963.com-九彩彩票app下载| www.29795.com-福彩中奖号码近期| www.778041.com-体彩七位数玩法规则| www.956611.com-网上玩彩有赢的吗| 环球彩票www.644996.com| www.760131.com-台弯福星彩-| www.868891.com-七星彩最新图规| 大赢家彩票www.599476.com| www.505065.com-牛彩跨度谜-| www.94876.com-广西烟草彩票| www.086606.com-福彩自助彩票机申请| www.777569.com-欢乐彩开奖-| www.875032.com-熊猫竞彩无网络| www.wv40.com-七乐彩今日专家预测| www.026538.com-lol博彩-| www.382925.com-小炮智能彩票预测| www.506043.com-明天快三有豹子吗| www.577458.com-黑彩平台代理违法吗| www.654921.com-麒麟彩票app下载| www.23.vip-七星彩内部有透露吗| www.521680.com-新浪彩票全国开奖| www.596392.com-怎么观察快三走势图| www.666636.com-彩票书哪个最好看| www.763908.com-甘肃兰州彩票店转让| www.830286.com-快三走势图乐彩网| www.903113.com-彩票合买有骗局吗| www.968602.com-北京色彩传奇骗局| www.cp2801.com-彩票开奖查询快3| www.507191.com-在百度上能买彩票吗| www.301325.com-福彩三d浙江走势图| www.392771.com-明天能买什么奖彩票| www.620016.com-彩票20选3查看| www.717307.com-彩色铅笔画画桃花| www.790296.com-炫彩词语-| www.865196.com-时时彩平台网站| www.932426.com-能玩天津时时彩漏洞| www.984120.com-宁夏快三推荐号码| www.93pz.com-彩色相机普及| www.620527.com-手机彩票送彩金| www.684577.com-中国福利彩票综合版| www.768980.com-足彩竞猜的app| www.908536.com-幸运8彩票平台网址| www.972943.com-大发快三是否正规| 600彩票www.336766.com| www.212268.com-彩票开挂神器下载| www.77891.com-点我看更多精彩内容| www.064654.com-88彩票平台怎么样| www.629783.com-吉林快三讨论平台| www.59hq.com-天津体彩app注册| www.520773.com-彩之星印刷-| www.869948.com-彩票计划员是拖么| www.944428.com-大联盟彩票是真的吗| 中国福利彩票www.08588r.com| www.ca4.com-80彩下载app| www.921019.com-彩票3d综合走势图| www.983680.com-幸运时时彩有官网吗| www.oy3.com-七星彩100期| www.36ss.com-时时彩在线黑马计划| www.3146.win-新浪足彩数据| www.27581.cc-双色球彩票计算器| www.l78.top-众乐彩大发快3| www.228903.com-306彩票下载| www.325435.com-新万彩吧资料| www.062283.com-国彩平台总代邀请码| www.335680.com-彩票报纸电子版| www.427855.com-广东十分彩开奖记录| www.538351.com-鸿运5分彩输了| www.739468.com-竞彩跟单-| www.990940.com-5分快三麒麟团队| www.fk72.com-七乐彩奖金计算器| www.6388.mobi-财富彩票平台官网| www.26479.com-乐和彩登陆中心| www.030678.com-今日体彩开奖直播| www.012933.com-快赢网快三推荐| www.103356.com-吉林省快三前一千期| www.216030.com-马来三分彩开奖号码| www.en39.com-1分钟开的彩票| www.zu45.com-七彩阳光体操视频| www.224088.com-江苏快三奖金| www.315893.com-福彩中心电话号码| www.381063.com-彩票双色球手机购买| www.498773.com-韩国足球彩票网| www.565070.com-鸿彩快三下载安装| www.620081.com-福彩票6838cc| www.678526.com-彩典宝库下载旧版| www.739403.com-八彩桌球-| www.797281.com-看彩啦3d-| www.577229.com-七星彩直播开奖在线| www.668785.com-老熊说彩专家| www.737389.com-永盛彩票网靠不靠谱| www.4841.cn-快三作弊软件视频| www.00935.com-博易api彩票接口| www.65770.com-买11选5黑彩破产| www.265783.com-在微信上玩彩票| www.5533.org-足彩吧狗万-| www.06568.com-福彩3d万能4码| www.45370.com-买彩票中大奖的新闻| www.801689.com-福彩开奖杳绚| www.907936.com-合肥体彩销售在哪办| www.979094.com-旋子彩画教程| www.cai8022.com上海快三开奖| www.08dy.cc-彩铅画动物简单教程| www.39399.com-全民中彩提款| www.537665.com-彩9彩票官方网| www.948042.com-双色球众彩网首页| www.998188.com-中国福彩发行中心| www.dk88.com-广州福彩快三| www.vi73.com-湖北福彩网公告| www.10.la-高频彩票新规则| www.78sl.com-时时彩技巧个人经验| www.668293.com-怎么分辨彩票黑平台| www.762758.com-腾讯重庆时时彩| www.843639.com-福利彩票付主任获刑| www.906278.com-开黑彩判刑-| 发彩www.50732l.com| www.er12.com-安装北京快三| www.ud11.com-快三官方彩票有哪些| www.37.cm-时时彩包赚法| www.51sm.com-最新苏州彩民中奖| www.441.live-红牛彩是真的吗| www.3458.live-体育彩票双色球单式| www.9986.win-足彩预测分析新浪| www.47177.com-四川福彩开奖查询| www.83808.cc-网络彩票怎么玩| www.035758.com-体彩中奖故事| www.220309.com-下载乐彩网app| www.234989.com-500博彩app-| www.303513.com-鑫彩网彩票真的吗| www.380480.com-七乐彩特别号走势图| www.559835.com-7788彩票收藏| www.036201.com-下载3d福彩-| www.959576.com-手机时时彩网送彩金| www.bz48.com-甘肃快三开奖果跨度| www.886383.com-好运彩票app下载| 易彩集团www.25688l.com| www.5045.org-网上实体店买彩票的| www.xu80.com-彩票能折叠吗| www.61uw.com-福彩3d17点和值| www.150986.com-乐彩软件是不是真的| www.77558.com-足球竞彩简单术语| www.700164.com-多彩网快乐12选5|