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.08rh.com-古典美人彩铅画图片| www.3250.vip-网冠彩平台-| www.09794.com-彩83官网-| www.68886.com-新浪竟技体育彩票| www.045447.com-牛彩网汇总图九| www.130484.com-彩控智能网-| www.36169.com-福彩3d守号牛人| www.006294.com-鼎盛彩票平台网址| www.125334.com-彩票刮刮奖真坑| www.538595.com-常州福彩申请| www.649747.com-博彩主要是做什么的| www.795221.com-今日彩票幸运号码| www.881558.com-辉煌彩票网站导航| 华夏彩票www.hx1114.com| www.0jr.com-彩虹屁文案-| www.824299.com-七星彩分析预测| www.906068.com-国彩有哪些平台| www.996242.com-竞彩足球网易| www.ed76.com-做彩票代理安全吗| www.18by.com-江呀体彩网-| www.717301.com-彩铅选48还是72| www.635586.com-七彩阳光动作视频| www.881453.com-234彩票苹果版| 博友彩www.808399.com| www.14uo.com-福彩3d彩票过客| www.4155.com-七彩国际汇所| www.1987.date-慧金彩商业彩票| www.41297.com-大丰彩票官网| www.99559.cc-北京分分彩是真的吗| www.532695.com-无惨三国星彩中| www.613995.com-生肖彩票下载| www.689898.com-91彩站联盟-| www.768618.com-六全彩赌博量刑| www.922812.com-人人红彩票-| www.995705.com-北京单场是什么彩票| www.bi46.com-时时彩稳赢技巧买号| www.yt98.com-山东体彩兑奖地址| www.108708.com-七星彩是否中奖查询| www.137811.com-中国彩客网首页| www.248988.com-彩票app开发制作| www.365422.cc-新起点彩票是骗局| www.462520.com-那种彩票中奖概率大| www.554442.com-19056期胜负彩| www.619277.com-昆明福彩中心在哪里| www.683813.com-誉彩彩票平台| www.756458.com-彩票打码员是什么| www.832051.com-七星彩摇号吗| www.894809.com-彩票助赢计划手机版| www.957295.com-众盈彩票时时彩官方| 全民乐彩票www.2934h.com| www.hy08.com-三的走势图今天福彩| www.076208.com-彩票免费计划大全| www.649644.com-彩色跑的意义| www.ig71.com-湖北彩民倍投守号| www.yl60.cc-易彩快3中奖规则| www.229779.com-彩票大全下载软件| www.332436.com-黑彩平台怎么制作| www.435298.com-莲中彩票-| www.219359.com-福建体彩领奖地址| www.333831.com-福彩怎么玩详细介绍| www.414314.com-彩票pk10玩法| www.720233.com-七星彩有谁玩没啊| www.800858.cc-彩票丹东全图| www.872251.com-红旗彩票菜种| www.934114.com-凤凰彩票不出款| www.982803.com-湖北快三玩法对照| www.jk92.com-深圳福利彩票官网| www.715676.com-贵州快三奖金设置| www.wx67.com-彩鸿彩票下载| www.72kg.com-大彩鲸11选5开奖| www.2836.cn-用你ip帮我玩彩票| www.11400.cc-本月足彩对阵表| www.66332.cc-华阳彩票真实性| www.928006.com-高频彩种-| www.979793.com-最安全的彩票软件| www.cp860.cc-教你百盈快三怎么玩| www.1234.cx-彩票倍率计算公式| www.9257.biz-陕西福彩提现不到账| www.638398.com-色彩搭配的技巧包括| www.893377.com-彩票在线工具倍投| www.971309.com-体育彩票广场摸奖| www.cz31.com-快三彩票摇奖模拟器| www.x00.in-彩票软件挣钱| www.0571.com-福彩3d计划-| www.e06.cn-体彩竞猜最多获奖| www.42qo.com-福彩3d直选杀码| www.5689.cm-pk彩票app-| www.83922.cc-农村天价彩礼作文| www.055135.com-国内彩票种类| www.136981.com-体彩店提成是多少| www.219173.com-三分钟彩票骗局| www.160279.com-广东快中彩中奖规则| www.158161.com-新浪彩票注册| www.9922.tv-今日体彩中奖号玛| www.79iy.com-1234彩票-| www.471224.com-香港三色彩有限公v| www.719433.com-体彩玩法说明| www.796553.com-印尼三分彩开奖结果| www.869503.com-香港六禾彩开奖结果| www.cd39.com-大发快三彩票网址| www.tr59.com-分分彩千万不能玩| www.8ls.com-体育彩票咋写| www.663935.com-头彩网下载-| www.fn3.com-国家叫停重庆时时彩| www.050121.com-福彩今天开奖号码| www.213925.com-大发快三大小预测| www.6210.loan-福利彩票连连看破解| www.973640.com-福彩双色球周四蓝球| www.ez57.com-国家为什么改高频彩| www.za88.com-体彩大乐透网上购买| www.89182.com-盈彩彩票是真的假的| www.893623.com-彩票组合软件下载| www.963407.com-内蒙古快3预测彩乐| 彩神网www.csw288.com| www.971423.com-众购彩票-| www.167018.com-快三秒是什么| www.977204.com-郓城彩礼新规定| www.cp764.com-五分快三网-| www.682266.com-微信免费提现彩票| www.757882.com-佰翔彩票怎么样| www.879799.com-吉林快三犯法吗| www.931137.com-吉林省福彩快3助手| www.971704.com-8号彩票软件| 中国福利彩票www.08588o.com| www.1218.tv-全民彩票能买彩票吗| www.12kh.com-贵州快三和值遗漏| www.88tc.com-七星彩票开奖时间表| www.661405.com-福彩3d有没有漏洞| www.733295.com-双色球彩票被洗了| www.797186.com-博牛彩票能提现吗| www.862509.com-时的彩挂机软件| www.944903.com-中国竞彩网论坛| www.980604.com-凤凰彩票平台| www.cp653.com-cp快三-| www.718516.com-彩虹网络用语| www.852055.com-体彩七位数按顺续吗| www.859133.com-3d绕胆图彩之网| www.978591.com-福建体彩票36选7| www.pq88.com-双彩网论坛官网| www.969569.com-酷彩美国官网| www.32dm.com-彩虹画画-| www.132896.com-足球彩票心得| www.219326.com-快三助手最新版下载| www.292351.com-3d今天的彩图| www.382436.com-自动挂机彩票| www.495551.com-博彩怎么做网络推广| www.562103.com-私彩2015-| www.622685.com-甘肃彩民中奖| www.739969.com-时时乐走势图彩经网| www.864422.com-新彩吧手机版3d| www.940526.com-台北快三下载| www.998955.com-永乐彩票假不假| www.pl38.com-海南体彩app| www.913988.com-立彩tl团队-| 大玩家彩票www.84499y.com| www.ki75.com-中国体彩排五走势图| www.82332.cc-七星彩交流论坛| www.099090.com-彩票大奖新闻| www.69098.cc-彩88彩票预测网| www.827566.com-世纪佳缘男彩票托| www.896212.com-彩票双色球合买大厅| www.956879.com-快三号码共有多少注| www.2dq.cc-手机鸿运彩票| www.90up.com-金鹰彩票计划|