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.507366.com-甘肃亿彩快三查询| www.654469.com-景德镇福利彩票地点| www.539690.com-深圳福彩是独立的吗| www.771665.com-疆时时彩开奖结果| www.012550.com-算局七星彩-| www.913151.com-胜负彩彩客网| www.998190.com-神州分分彩计划软件| www.eb93.com-彩票店营业时间| www.785623.com-领航彩官网-| www.877342.com-天津时时采彩app| www.039316.com-福彩走势图百度彩票| www.12xb.com-完美彩票咋样| www.0536.org-什么叫彩蛋-| www.7106.top-七彩花坊-| 博友彩www.195622.com| www.0626.org-武汉福彩机转让| www.03nc.com-彩票驿站是什么意思| www.97ep.com-福利彩与体彩| www.741.cm-八百万彩票网| www.5533.site-足彩加推荐怎么样| www.38991.cc-好彩1基本走势| www.93841.com-网易彩票注册| www.052538.com-3d彩神通彩票软件| www.122000.com-马云买大乐透彩票| www.801527.com-长城彩票真假问题| www.972193.com-福彩3d跨度遗漏| www.no3.com-河南快三任意俩码和| www.o84.cn-彩票怎么玩规则| www.257774.com-038彩票老版| www.345616.com-本子福利吧全彩触手| www.000525.cc-时时彩不贪一个月| www.557262.com-水彩画教程-| www.899235.com-彩乐彩票网官方网站| www.979913.com-河南福利彩票新快三| www.da54.com-人人中彩网客户端| www.x00.club-时时彩在哪买| www.25356.cc-水彩入门-| www.387709.com-七星彩守号30年| www.565535.com-中国彩吧网手机登录| www.683779.com-天天爱彩票官方| www.272299.com-一分快三中奖规律| www.250006.com-2019年网络购彩| www.412008.com-查彩票下载什么软件| www.699866.com-正版神马报幸运彩| www.784857.com-七星彩专家最新推荐| www.875002.com-江苏快三是国家彩票| www.942068.com-3g彩票-| www.988680.com-73期期好彩-| www.bd74.com-生肖彩票开奖结果| www.ed51.com-彩票推广话术| www.260717.com-福利彩票比较器| www.237569.com-体彩实体店报价大全| www.22967.cc-王者彩票有什么技巧| www.35zn.com-七星彩第四位走势图| www.543236.com-牛彩纽约登录| www.cai8157.com安徽快三今天| www.77cq.com-周易与彩票预测| www.3322.org-江苏体彩7位数规则| www.31336.com-快三安徽开奖查询| www.562105.com-体彩最快开奖结果| www.52969.cc-黑彩代理如何拉人| www.022571.com-体彩排列三天使断组| www.111901.com-怎样在手机上买彩票| www.173985.com-全民快三app| www.ms7.com-湖湖北快三-| www.xh28.com-苏州快三是什么| www.10ub.com-时时彩下载app| www.905283.com-快乐彩查询中奖号码| 鑫亿彩www.039079.com| www.e19.top-下载全民彩票大厅| www.02zk.com-彩虹伴奏周杰伦女生| www.818636.com-五百彩票网下载| www.942198.com-赢彩彩票app| 大赢家彩票平台www.795917.com| www.pj64.com-中国体彩开奖直播| www.65mk.com-双色球彩票机选| www.52397.com-亚博彩票靠谱吗| www.621383.com-百度3d家彩网| www.387566.com-手机贴汽车彩膜| www.691662.com-胜负彩开奖号码| www.cp2544.com-江苏快三中奖金额| www.658077.com-31竞彩-| www.828829.com-934彩票-| www.921891.com-温州快乐彩走势图| www.aa29.com-体彩排列三开奖| www.296595.com-安徽十一选五彩票| www.09096.com-广东彩票这个软件| www.140417.com-合法的彩票网站| www.210275.com-快三开奖查询宁夏| www.127749.com-新版彩虹代刷app| www.347060.com-竞彩卖料-| www.497794.com-十三国际彩票邀请码| www.8kj.cc-浙江福利彩票销售点| www.964813.com-一分时时彩官网计划| 彩票5www.543122.com| www.0101.pw-彩票店头像-| www.831290.com-彩票官员自己中奖| www.910693.com-9号彩票平台| www.965545.com-北京福彩自助| 福彩www.86267k.com| www.in69.com-1360彩票-| www.l74.cc-彩81彩票苹果下载| www.743198.com-糖果派对彩金怎么算| www.579365.com-流晶逸彩-| www.771220.com-彩虹图画儿童画| www.028507.com-好彩票是不是黑平台| www.995704.com-足彩能买单场吗| www.75wy.com-台湾福星彩最新图库| www.2765.com-爱乐彩票安卓| www.1159.in-福彩3d术语知识| www.285737.com-中福快三计划网址| www.422702.com-彩票360是否合法| www.590625.com-709彩票苹果下载| www.466757.com-胡北体彩11选5| www.006093.com-福彩3d开奖号多少| www.127040.com-山东福彩双色球| www.24xv.com-双色球兰州彩民| www.ua15.com-彩票平台快三| www.247299.com-上海福彩选四开奖| www.980340.com-709彩票网站| www.mp64.com-彩富网-| www.54lf.com-快三49期-| www.036531.com-中国体育彩-| www.587865.com-福彩3d最大奖得主| www.750719.com-爱彩彩票来自哪里| www.871194.com-3d推荐星彩网| www.bh41.com-买五分彩的正规平台| www.1ao.com-彩神安徽快三下载| www.9012.biz-河内五分彩开奖直播| www.969139.com-网易竞彩推荐预测| 500彩票www.52072x.com| www.bu06.com-大财神彩票app| www.rc10.cc-彩票166-| www.m30.org-体彩足球彩票怎么买| www.33pz.cc-昨晚开什么奖七星彩| www.081089.com-彩票能中大奖的咒语| www.134887.com-铁盒好彩烟-| www.202339.com-江西福彩助手可靠吗| www.258137.com-乐米彩票安卓| www.307810.com-腾讯分分彩漏洞百出| www.356654.com-过生日送彩票怎么说| www.392695.com-体育彩票打票教程图| www.3089.biz-云南弃奖彩票| 9号彩票www.80767b.com| www.hh54.com-旺彩专业3d-| www.873639.com-彩票计划源码| www.943566.com-微微彩票官网下载| www.991287.com-彩票自动核对| www.io66.com-310足球彩票| www.257603.com-038彩票作弊| www.508661.com-体彩天下可以赚钱吗| www.682601.com-彩吧红五图库| www.553762.com-竞彩严明明推荐| www.609371.com-体育彩票时时彩规则| www.342154.com-期期有好彩-| www.35dh.cc-开心七星彩交流论坛| www.98985.cc-时时彩跨怎么看| www.41399.com-彩牛美缝剂商标| www.882407.com-彩吧论坛保真天齐网| www.099027.com-pc蛋蛋彩票正规吗| www.946668.cc-福彩东方6十1预测| www.gt97.com-网赌快三背后控制| www.82bh.com-彩票送16-| www.3079.biz-彩票体彩双色球开奖|