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.9761.cc-默彩-| www.80856.cc-福彩排三今天开奖| www.053200.com-苏州彩票店转让信息| www.qf17.com-晚晚好彩-| www.1290.in-彩票模拟试玩网站| www.8363.org-海南体彩直播现场| www.33734.cc-网络时时彩诈骗新闻| www.87288.cc-彩票知识-| www.055537.com-福利快三显示图| www.266377.com-d55彩票-| www.48ja.com-七星彩单期走势图| www.7417.cn-色彩三原色-| www.52251.com-黑彩平台会有漏洞吗| www.165009.com-体彩竞技彩是骗局| www.255645.com-七星彩奖表下载| www.272163.com-博牛彩票规律| www.430968.com-鸿丰娱乐时时彩平台| www.636442.com-幼儿绘画彩虹| 网易彩票www.26163k.com| www.vh71.com-正规赚钱彩票平台| www.53st.com-共享彩票下载安装| www.4748.org-彩票捐款排名| www.16041.com-竞彩足球跟单靠谱吗| www.71218.com-全国体彩-| www.486355.com-陕西福彩开奖时间| www.641991.com-彩票方格-| www.809944.com-金福彩票网挣钱| 500万彩票www.5441r.com| www.9dd.cc-买彩票一般中多少钱| www.459001.com-香港6合宝典彩图| www.631728.com-海南七星彩开奖查询| www.715030.com-玩彩票什么叫反计划| www.805236.com-奥客彩票双色球| www.883154.com-彩678平台可靠吗| www.537269.com-春秋彩票骗局| www.947404.com-快三多久开一次新区| www.880380.com-快三遗漏数据一定牛| www.32732.com-彩乐汇平台-| www.986813.com-足球完场比分彩客网| www.je61.com-体彩福彩开奖查询| www.p99.online-86彩票-| www.65qd.com-分分彩人工计划| www.1692.org-彩票5950-| www.7908.vip-18098期足彩| www.397319.com-腾龙时时彩统计官网| www.522169.com-分分彩后二复式绝技| www.877799.cc-做私彩-| 彩票坊www.022i.cc| www.329185.com-湖北福彩3d开奖| www.441533.com-nba精彩集锦| www.639402.com-体彩机多少钱一台| www.752998.com-买足彩软件-| www.819238.com-如何成为彩票高手| www.886541.com-体彩七星彩论坛| www.960090.com-赠彩金的app| 东方国际www.055972.com| www.hy79.com-福彩快三到底是什么| www.26gi.com-福彩体彩对联| www.32541.com-百万彩票旧版入口| www.94166.com-pc彩票经验-| www.a38.shop-彩9彩票网-| www.32to.com-体彩走势图31选7| www.520008.com-彩票中奖后怎么理财| www.47ai.com-联通手机彩铃网站| www.2232.in-万彩彩票app下载| www.8996.club-博猫2分彩-| www.244659.com-彩票助手软件靠谱吗| www.335469.com-体育彩票怎么买号| www.9849.me-古建筑彩绘枋心图片| www.859905.com-娱乐彩票下载| www.993390.com-足彩19044实单| www.oh41.com-皇都彩票犯法吗| www.35yv.com-亿彩骗局解析| www.634.cn-私彩代理怎么定罪| www.130305.com-彩票查询结果排列五| www.583873.com-足彩大赢家软件下载| www.654051.com-合一彩票登陆页面| www.4527.com-联合买彩票中奖新闻| www.46150.com-蛋蛋幸运彩票骗局| www.022738.com-彩票大神跟单| www.146100.com-七星彩开奖结果星彩| www.846459.com-3d福彩我要买| www.951221.com-京彩国际平台骗局| www.ai6.com-广西快三倍投技巧| www.953111.cc-凤凰彩票咋下载| www.998161.com-彩票公司电话号码| www.rd3.com-甘肃快三专家预测网| 福彩www.15355d.com| www.301.biz-买彩票带来的官司| www.8545.cn-体育彩票游戏机| www.61301.com-038彩票监管| www.062404.com-黄金集团彩票靠谱不| www.862708.com-上海天天彩选4开奖| www.79fx.com-北京杨艺快三教学| www.7484.cm-彩店云app-| www.027623.com-166彩票站-| www.192009.com-江苏彩经网快三| www.263278.com-网购彩票入骗局| www.125267.com-福彩出奖号今天| www.193286.com-甘肃福利彩票双色球| www.254616.com-福彩3d图谜第二版| www.356845.com-复式彩票怎么中奖| www.5098.biz-广州福利彩票投注站| www.00609.com-18075期足彩| www.53769.cc-福利彩票十一期查询| www.477999.cc-福利彩票十三五规划| www.664111.com-乐彩苹果怎么下载| www.806156.com-南囯的彩票精彩论坛| www.915068.com-大发快三投注攻略| 彩71www.861150.com| www.797010.com-福彩快三守号技巧| www.894670.com-彩票速中法-| www.977785.com-足彩水位-| www.gl42.com-查福彩开奖结果| www.u53.cn-送彩金58彩票| www.17hf.cc-中国福彩报电子报| www.794.cm-王中王彩票预测| www.7376.wang-转让彩票店-| www.38243.com-505彩票建多少年| www.626965.com-双彩网张维新| www.726648.com-彩虹频道app下载| www.807658.com-世界中奖最高的彩票| www.886443.com-90在线九龙彩票| 500彩票www.602469.com| www.sd01.com-手机彩票群骗局揭秘| www.937861.com-彩票拉人-| www.990585.com-买彩票破解器有用吗| www.cw60.com-必赢彩票下载app| www.621781.com-关於台湾彩券| www.680914.com-辽宁省福彩中心| www.612609.com-巴西三分彩官网| www.303188.cc-甘肃快三推荐群| www.631059.com-足彩冷门推荐| www.766372.com-中国福彩快三图表| www.899146.com-北京幸运28彩票| 六福彩票www.66ffg.com| www.56044.com-微信彩票骗局| www.750607.com-彩票全自动挂机软件| www.413318.com-足彩改期奖金怎么算| www.690553.com-可以购彩的app| www.015843.com-体彩扑克牌豹子多钱| www.143550.com-福彩双色球选号公式| www.245554.com-网易快三彩票| www.914419.com-彩票166登陆| 全民福彩www.qmfc6.com| www.iz08.com-中国体彩手机投注| www.x87.net-奥客彩票网手机版| www.271957.com-中原彩票能赚钱吗| www.371600.com-彩铅风景画图片大全| www.504971.com-彩排的心情说说| www.596675.com-甘肃快三新闻| www.mr39.com-浙江快乐时时彩| www.85.cx-下载7k官方彩票网| www.84qn.com-体彩网手机积时比分| www.874705.com-湖北福彩投注客户端| www.923886.com-cp彩票骰子-| www.974081.com-三地走势图中彩网| 亿彩彩票www.142525.com| www.cp3235.com-福彩快三代理是什么| www.931411.com-江苏体彩7位数玩法| www.976915.com-雷诺好彩一预测| www.cai3844.com快三走势-| www.5889.biz-结婚彩礼钱应该给谁| www.38801.com-信中彩-|