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.105646.com-c59彩票四不像| www.234086.com-彩票坊能玩吗| www.309249.com-马来西亚乐和彩合| www.379062.com-国家足彩培训师| www.703966.cc-万人彩票可信吗| www.788737.com-足彩赛程安排| www.867908.com-南海七星彩坛论坛| www.965014.com-境外彩票网站大全| www.cp800.com-私彩哪个app靠谱| www.kp18.com-福彩快3概率| www.a99.vip-十字彩下载-| www.34ir.com-七星彩什么时候停售| www.1405.vip-手机众彩网彩票专家| www.8167.cm-彩票故事大全| www.31100.com-彩尊app打不开了| www.77293.cc-彩客手机官网| www.028936.com-通宝博彩-| www.108485.com-彩票倍投骗局| www.178706.com-广西新快三开奖结果| www.254403.com-爱彩乐双色球助手| www.328345.com-中彩吧app下载| www.397493.com-体彩今天正版天庚图| www.596700.com-下载竞彩足球官方网| www.670969.com-国彩是什么项目| www.750425.com-手机体育彩票靠谱吗| www.822757.com-爱马仕蓝彩星光香水| www.896694.com-黑桃k彩票怎么样| www.964259.com-彩票筛选软件app| 8号彩票www.60108x.com| www.ge08.com-福彩七乐彩没人买| www.xp45.com-易彩网下载安装开户| www.19vx.com-彩票五-| www.833.in-现场直播的彩票| www.5013.cm-彩经彩票平台| www.02804.com-体彩十一选五新规则| www.68075.com-彩票赌博罪量刑标准| www.646145.com-竞彩口诀-| www.zl49.com-500万彩票走势图| www.113939.com-彩涂铝卷加工| www.709315.com-五行预测彩票规律| www.787567.com-竞彩篮球怎么买| www.862121.com-辛运彩-| www.926028.com-福彩下一-| www.981309.com-河北竞彩官方网站| www.xv85.com-彩6app官网下载| www.10uy.com-黑彩代理返点犯法么| www.79fz.com-彩票性缘分-| www.1407.cc-大赢家彩票网正规吗| www.27422.com-宜人财富彩票| www.82952.com-我的五百万彩票人生| www.035722.com-红彩会线路导航| www.136141.com-中国的彩票有多坑| www.212234.com-快三倍率是多少钱| www.281938.com-很多体彩店没有竞彩| www.382011.com-分分彩挂机不爆方案| www.503234.com-鸿彩彩种-| www.574911.com-惠盈竞彩app地址| www.644868.com-九龙彩坛免费| www.751457.com-淘之家彩票合法吗| www.819581.com-彩票大数据统计| www.886682.com-福利彩票双色球对奖| www.975412.com-福利彩票摇一摇机选| www.cp53.com-极速快三必出码技巧| www.kv22.com-上海福彩天天彩选四| www.c65.top-百宝彩上海快三下载| www.28rw.com-天禧彩票网正规吗| www.0146.xyz-色彩造句简单| www.6102.vip-彩票易中奖官网| www.11169.cc-河南福彩快开| www.52442.cc-3d选号彩报18年| www.92900.com-乐彩33平台众飞| www.046621.com-288彩票安卓| www.162316.com-e足彩-| www.241044.com-彩虹是什么意思| www.312288.com-福彩双色球字迷总汇| www.376415.com-99彩登陆平台登录| www.510245.com-哪个平台可以买体彩| www.576634.com-手机3b彩报-| www.640518.com-k彩平台是黑台吗| www.740094.com-搜狐数字彩票网| www.805718.com-彩吧网预测总汇| www.874352.com-彩票三地-| www.962324.com-网上买彩票哪家靠谱| www.70109.com-竞彩足球胜平澳客网| www.501285.com-天津黄埔快三| www.mj38.com-好彩香烟官网| www.177181.com-什么叫一分快三| www.244741.com-大神玩彩心得| www.311753.com-福彩3d彩报图库| www.373508.com-看彩吧加入微信| www.526503.com-时时彩后二复式组选| www.611975.com-时时彩票违法吗| www.677030.com-福彩坑吗-| www.743128.com-彩经网官网下载安装| www.806668.cc-彩票每天救援金| www.873807.com-彩票31app-| www.968441.com-三分时时彩开奖数据| www.cai938.com-北京快三是什么| www.ig34.com-国家彩票软件| www.xq63.com-彩票要去店里买吗| www.12xf.com-重庆时时彩官方登录| www.73oy.com-彩易双色球-| www.0518.wang-福彩刮刮乐中大奖| www.8923.wang-天下第一高手彩票| www.37529.cc-立彩彩种-| www.77227.cc-105彩票不给提现| www.021587.com-幸运分分彩计划软件| www.086111.com-福利彩票赚钱吗| www.137865.com-彩之星是正规的么| www.207737.com-恒彩彩票app| www.270097.com-132彩票官方网站| www.486045.com-大发彩票平台可靠吗| www.554249.com-大富彩票网金福彩票| www.612267.com-七彩虹图片大全| www.671543.com-彩一万网站-| www.736912.com-大众彩票网每日首充| www.798691.com-盛世彩票官网app| www.866431.com-搜狐彩票是正规| www.920267.com-拼搏在线彩票彩神通| www.971519.com-彩票333安卓| www.iw44.com-连中彩彩票-| www.xo57.com-买足球彩票的app| www.06rd.com-qq赠送彩票-| www.63se.com-乐彩论坛h5-| www.749.bid-时时彩三星怎么做号| www.3862.xyz-彩票cp9811-| www.8489.cn-6d彩票下载-| www.60805.com-体彩11选5开奖号| www.008340.com-在网上买彩票犯法吗| www.064014.com-卖私彩会被判刑吗| www.139003.com-三的天天彩-| www.201712.cc-快三app苹果版| www.260549.com-内蒙古快三一码遗漏| www.319767.com-k彩福地登陆| www.963183.com-体彩顶呱刮新票| www.48677.com-极速时时彩官方下载| www.427957.com-足彩方案-| www.977822.com-足彩去哪兑奖| www.hh92.com-豪彩平台app下载| www.vx59.com-贵州体育彩票中心| www.58.com-亿元大奖彩票图片| www.55pz.com-安装天天彩票双色球| www.534.bid-网上玩时时彩会抓不| www.3160.org-808彩票app-| www.7746.com-体彩毒胆三天计划| www.18184.cc-竞彩网计算-| www.52399.com-江苏快三猫腻| www.82185.com-8号彩票多少能提现| www.024329.com-福彩3d迷图-| www.082708.com-彩票与概率-| www.132360.com-内乡和社旗彩礼| www.191266.com-快三吉林和值走势图| www.248978.com-天天中彩票-| www.306336.com-澳发彩票下载| www.362728.com-彩票缺角能兑奖吗| www.428342.com-海南七星彩过滤软件| www.509358.com-广州利彩静电分选机| www.566719.com-彩虹六号ul战队| www.620298.com-竞彩亚盘怎么玩| www.675221.com-名人彩票法国时时彩| www.733510.com-福彩大乐透网上购买| www.794959.com-快三福彩解除银行卡| www.856793.com-菲律宾体彩公司工作| www.912057.com-如何报复黑彩平台|