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天

知道了
彩39彩票安卓 www.2fa.com-时时彩平台有哪些| www.050557.com-河南福彩幸运二技巧| www.di32.com-热门彩种下载| www.111164.com-河北快三购买平台| www.30485.com-京东有卖彩票吗| www.99870.com-彩客网胜负投注分析| www.077978.com-七星彩头尾包码方案| www.761078.com-男女结婚彩礼钱| www.847850.com-山东彩礼排行榜| www.524949.com-彩票平台挣钱办法| www.236166.com-1360彩票-| www.sr50.com-彩票为什么不是直播| www.986388.com-金手指彩票软件| www.09ww.com-福彩双色球几号停| www.287928.com-500彩票怎么合买| www.369822.com-乐彩票-| www.478558.com-深圳体彩中心兑付| www.288039.com-能合买的彩票软件| www.404011.com-复式投注体彩大乐透| www.411039.com-七彩云南歌词作者| www.529364.com-宝岛彩票开奖查询| www.739749.com-中国福利快乐彩开奖| www.830506.com-金华福彩申请| www.983231.com-网络彩票是赌博吗| www.bd76.com-快三单双大小规律| www.b61.vip-福利彩票3p走势图| www.s96.cn-加盟体彩怎么样| www.ew85.com-中国彩票官网| www.105078.com-新浪爱彩比分直播| www.024516.com-六福彩票官方网站| www.44801.com-网上福彩投注站| www.682087.com-竞彩交流微信群| www.293373.com-智慧彩挂机网| www.039658.com-会员登陆9b彩票| www.323082.com-湖北福彩网东湖论坛| www.302590.com-澳门官网彩票| www.369561.com-旺旺彩有中奖的么| www.465366.com-什么是数字型彩票| www.550640.com-沈丘彩票-| www.615262.com-美狮彩票下载| www.682306.com-福建福快三-| www.757797.com-众彩易购是假的吗| www.836264.com-彩票a-| www.897099.com-乐彩赢主页| www.956443.com-富贵彩害死了| 凤凰Vwww.www.fh6116.com| www.419222.com-风落中彩大乐透预测| www.551092.com-福彩双色球怎样合买| www.638444.com-天吉福彩彩票论坛| www.360446.com-彩影2010-| www.522427.com-韩国分分彩精准计划| www.637031.com-彩虹一5无人机| www.069268.com-佰萬彩票合法吗| www.2848.vip-七星彩中奖怎样领取| www.597078.com-福彩群英会预测软件| www.972240.com-52快三-| www.042775.com-彩票搞笑-| www.185456.com-全国正规的福彩快三| www.429077.com-郑州快三开奖号码| www.543002.cc-金凤凰彩票平台| www.614982.com-球彩台无插件直播| www.681569.com-豪彩娱乐下载链接| www.762157.com-竞彩足球分析app| www.836201.com-福建体彩136选7| www.896005.com-蒙古古快三-| www.957246.com-足彩单场比分直播| 彩票坊www.022jx.cc| www.bi51.com-有人拉你投彩骗局| www.473656.com-体彩排三中奖号多少| www.363391.com-彩虹色的花故事| www.559012.com-海南七星彩投注官网| www.732017.com-足彩任选九推荐| www.871377.com-双色彩票下载| www.990260.com-乐玩彩官方下载| www.zr65.com-好彩门户-| www.123644.com-福彩3d秘密通道2| www.503435.com-红彩盒子下载| www.361344.com-7k彩票网567| www.276917.com-彩票总动员走势图| www.408804.com-体育足彩18069| www.557565.com-快速登录神灯彩票| www.lz34.com-快三挂机安卓| www.039994.com-辽宁竞彩快三| www.805055.com-彩票361平台| www.968146.com-微信中华彩破案| www.ss67.cc-山东体彩论坛| www.5333.mobi-淘宝网买彩票| www.037746.com-七乐彩360-| www.288289.com-爱彩乐彩票网时时彩| www.816922.com-彩票中奖最多的人| www.916200.com-10分快三下载安装| 网易彩票www.26163n.com| www.53gp.com-彩票兑奖查询器| www.440371.com-河内五分彩记录下载| www.46528.com-今晚好彩2开奖| www.435363.com-微信福彩-| www.967029.com-被骗玩快三-| www.7408.org-体育彩票竞彩上海| www.28857.com-亚博体彩终落入法网| www.79199.cc-彩膜是什么-| www.484.org-福彩3d陈华胆码| www.77506.com-必赢彩票还能用吗| www.609034.com-彩票店一天的销售额| www.050001.com-找黑彩坐庄的老板| www.869238.com-非凡彩票走势图| www.970505.com-安徽体彩网唯一官网| www.10yp.com-体育七星彩直播现场| www.1939.date-今日福彩保真版图谜| www.506519.com-彩天地app下载| www.858402.com-重庆时时彩今天暂停| 500万彩票www.96386m.com| www.54kh.com-幸运之门彩票图表| www.363036.com-吉林快三是否合法| www.610719.com-足彩胜负彩结果| www.0335.in-歌曲彩红的约定| www.ga86.com-浙江12选5快乐彩| www.84840.cc-牛彩网图库总汇大全| www.536579.com-快三漏号-| www.950775.com-彩票友交流群| 福彩www.15355r.com| www.954179.com-足球彩票18101| www.690962.com-竞彩十四胜负彩开奖| www.792311.com-3d图第二彩吧| www.954418.com-彩票l23-| www.cp467.cc-私彩网-| www.16cu.com-七彩娱乐官网注册| www.981683.com-中彩娱乐网登录| www.re72.com-快三平台作弊软件| www.04235.com-全中民彩票-| www.161079.com-中国体育彩票三等奖| www.246601.com-福彩多久开一次| www.518484.com-炫彩弹球ios| www.298927.com-彩神争霸8吉林| www.384545.com-福利彩票算什么单位| www.497333.com-万福彩票下载| www.559731.com-多彩贵州网电话| www.618745.com-足彩关小刀最新推荐| www.680492.com-彩票害死人-| www.739043.com-微信彩票群怎么拉人| www.794697.cc-附近体育彩票竞彩店| www.852886.com-河内五分彩有漏洞吗| www.899835.com-c彩83下载-| www.952413.com-时彩是不是骗局| www.997499.com-职业时时彩玩家绝招| www.bg53.com-易彩兼职是不是骗局| www.qt39.com-支付宝停止彩票兑换| www.319.red-m5彩票登录-| www.455804.com-彩票大奖都是托| www.4199.tv-福星彩运回放| www.571590.com-好运彩彩票网站| www.761457.com-电视剧好彩妹| www.856627.com-想开一个彩票站| www.930046.com-体彩排列3基本走式| www.998955.com-永乐彩票假不假| www.rx7.com-上海快三五百期| www.qw57.com-二分彩开奖号| www.41ie.com-贵州快3是什么彩票| www.927.red-临沂孙大夫彩票绝技| www.237742.com-竞彩足球比分网| www.376937.com-腾讯308彩票网| www.526151.com-篮球彩票怎么看| www.36528.cc-下载彩票大全手机版| www.272511.com-好彩蓝莓爆珠多少钱| www.489554.com-小白彩票老版本|