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.8426.vip-快三哪种玩法好中奖| www.277600.com-乐彩赢主页-| www.22927.com-手机购大乐透彩票| www.057300.com-安徵福彩-| www.fq92.com-天天快三在线| www.83240.com-安阳有转让彩票站| www.4821.vip-万众彩app-| www.81eh.com-中福彩积分兑换| www.659343.com-博彩免费源码| www.155475.com-彩票直播现场直播| www.703885.cc-粤十一选五爱彩乐| www.934598.com-盈彩网如何注销账号| www.367839.com-不喜欢刚力彩芽| www.967717.com-买彩票能中吗| www.gu42.com-7彩冰淇淋-| www.887029.com-时时彩婚恋骗局| www.11210.com-九龙彩票下载| www.1577.vip-多彩贵州集团官网| www.28540.com-福彩快三在线| www.725078.com-分分快三助手软件| www.t34.bid-预测七乐彩-| www.217361.com-大发快三必中软件| www.465906.com-利发彩票下载| www.103052.com-广东好彩2开奖结果| www.w81.xyz-浙江体彩大乐透1| 博友彩www.960206.com| www.008697.com-大智慧快三-| www.227660.com-广西福彩快三遗漏| www.604925.com-七星彩梦秘解图解梦| www.796069.com-亿乐彩官方登录网| www.32at.com-竞彩玩法返奖率| www.591090.com-ck8888彩客-| www.814869.com-刑法经营体育彩票| www.913210.com-彩经网3d选胆图| 网易彩票www.506237.com| www.7298.top-福彩3d多久能中| www.10nb.com-福彩3d开奖| www.120583.com-新彩票网首页| www.236617.com-六彩票吧-| www.254725.com-一分彩开奖-| www.645748.com-俄罗斯守护者彩蛋| www.374418.com-山东彩票官方版下载| www.777729.com-小财神3d彩票论坛| www.840.mobi-二八彩票充值| www.900.gg-篮彩nba比赛结果| www.878884.com-河北快三初几开奖| www.970013.com-彩票平台安全购彩| www.74302.com-彩虹旗emoji| www.984151.com-彩民彩票怎么打不开| www.lx45.com-天津时时彩-| www.29797.com-双色球彩友彩游侠| www.1939.top-双彩论坛晚间字谜| www.010021.com-重庆时彩下注官方| www.602364.com-送体验金的彩票| www.42dn.com-竞彩足球赛事赛程| www.022.org-福彩75期开奖号码| www.113933.com-彩涂铝板生产厂家| www.654537.com-帝一娱乐官网时时彩| www.701530.com-两姐妹买彩票被骗| www.833825.com-3d天天中彩吧字谜| www.421.biz-塘沽的快三秒| www.673910.com-古建彩绘卷花| www.442307.com-福彩和值跨度速查表| www.775520.com-欢迎光临聚宝彩票网| www.068339.com-一彩送货单打印软件| www.308886.com-哪里买南洋乐和彩| www.13mi.com-大星大星彩票走势图| www.63nm.com-微信九宫格彩票| www.87852.cc-华阳彩票下载| www.138415.com-北京彩票赛车| www.070605.com-五分时时彩追号计划| www.887551.com-下彩网安全吗| www.24660.com-儿童彩铅画教程| www.282179.com-时时彩5星选号技巧| www.6364.net-彩票纸能做假吗| www.172102.com-河南快三跨度走势图| www.645444.com-足球竞彩口诀| www.682.cm-赌时时彩赢三百万| www.39876.cc-彩票吧士-| www.365892.cc-福彩和值遗漏分析| 聚彩网www.820335.com| www.531570.com-彩票速赚攻-| www.480830.com-彩云的寓意-| www.700338.com-多彩网com-| www.q50.cc-广西快三诀窍| www.128424.com-彩票分析预测应用| www.810129.com-手机贴彩膜多少钱| www.428847.com-福利彩旗下的快开| www.316766.com-江苏快三口诀| www.gk12.cc-河南彩礼规定| www.315064.com-安彻快三跨度走势图| www.703326.com-体育彩票刮刮乐下载| www.607997.com-天窆彩票与你同行| www.751294.com-9w彩票app-| www.76519.com-彩票定律-| www.389295.com-七乐彩是什么彩票| www.852016.com-500彩票网站| 中彩网www.81233c.com| www.62ue.com-极速快三快三走势| www.036516.com-彩票历史号码对比器| www.205647.com-利记博彩app| www.369886.com-彩之云不登录| www.589085.com-跑拘图好彩堂| www.755426.com-够力七星彩解梦下载| www.3396.mobi-k9彩票app-| www.30868.com-福彩三d开机号| www.120913.com-三d福彩-| www.rl7.com-红牛彩票app| www.03gw.com-彩天堂平台手机登录| www.3593.top-微彩吧计划-| www.408052.com-喜中七星彩二等奖| www.93ui.com-同版1寸彩色证件照| www.16016.cc-北京时时彩购彩平台| www.1596.cm-福彩老总被抓| www.74458.com-黄金时时彩计划软件| www.192955.com-甘肃快三15号| www.359007.com-七星彩开将查询| 500彩票www.629683.com| www.a80.net-霍金的彩票中奖公式| www.982.cm-奖虫七星彩网址| www.019013.com-往期体育彩票结果查| www.287128.com-网彩票如何申请代理| www.611194.com-体彩利润-| www.749209.com-汇彩国际信誉平台| www.tc80.com-快3属于什么类彩票| www.1772.vip-爱中彩票网站| www.133089.com-快三输了很多能回血| www.632004.com-福彩体彩玩法介绍| www.097938.com-下载本地万彩吧| www.557371.com-快三快速回血| www.874801.com-118彩票网可信吗| www.91sn.com-幸运365彩票| www.255018.com-时时彩万能固定三码| www.404673.com-七星彩360包码| www.707631.com-重庆实时彩官网| www.877552.com-福利彩票开奖期| www.85vi.com-网彩漏洞-| www.5038.vip-购彩之家991| www.84156.com-海南七星彩开心论坛| www.760395.com-三彩衣服质量怎么样| www.t46.site-登录优彩网-| www.0588.cn-买彩票的鼓励话语| www.177847.com-北京快三开奖结| www.381554.com-七星彩号码表| www.594099.com-七彩云网络-| www.719021.com-彩虹的形成图| www.874022.com-福利彩票三d开奖| www.ot50.com-彩票335-| www.23jn.com-彩票打流水兼职| www.42174.com-中国福利彩票平台| www.336340.com-彩票网站提现不了| www.565318.com-徐文轩说彩-| www.717839.com-77彩票充值截图| www.836710.com-陕西体彩官网| www.03ru.com-北京市体彩-| www.2696.live-湖北体彩官网购买| www.25699.cc-彩乐乐杀号定胆| www.96299.com-买彩票亏了几百万| www.116928.com-彩票加倍买可以中吗| www.242476.com-168彩票网合法吗| www.728018.com-名人彩票测速登陆| www.849896.com-竞彩官方是什么意思| www.936255.com-彩票假的没人管| 大赢家彩票平台www.109027.com|