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天

知道了
9彩注册 凤凰彩票www.3479p.com| www.11127.com-三分彩人工免费计划| www.73259.com-上期彩票得主死亡| www.178834.com-快三牛逼计划群| www.637826.com-安阳体育彩票网点| www.336155.com-彩票网大数据| www.9450.xyz-美狮彩票网址| www.4lp.com-幸运分分彩软件| www.926626.com-褔建体彩31选7| www.25897.com-聚彩彩票合法的吗| www.832884.com-福彩3d太湖钓字迷| www.986858.com-福建即乐彩中奖规则| www.pu45.com-a1彩票-| www.052.cm-玩彩票注意些什么| www.6176.cc-彩色透水混凝土配比| www.77762.com-中国福彩8炫彩| www.115661.com-彩色水磨石地面图片| www.102738.com-时彩在哪玩-| 凤凰彩票www.66652b.com| www.i23.pw-百度彩票开奖查询结| www.3317.biz-彩票网2元-| www.50600.com-快彩票下载-| www.068201.com-福彩三d和值表| www.209438.com-福彩排列5怎么玩| www.385019.com-下载澳客彩票网| www.710379.com-对打套利彩金| www.861518.com-百乐彩app-| www.7546.cm-网投快三是什么彩票| www.55612.cc-三分时彩官网| www.043039.com-足球彩票买不了| www.dw51.cc-彩福彩票aq-| www.643899.com-足彩任九19029| www.358234.com-豪哥足彩篮彩| www.831107.com-广州彩盒包装印刷厂| www.4228.cm-下载够力七彩奖| www.57167.cc-快乐彩票骰子大小| www.028152.com-彩票验票码怎么用| www.101821.com-500万竟彩网| www.176306.com-百盈快三怎么找规律| www.266614.com-快三52期开奖结果| www.339249.com-深圳福彩中心主任| www.435209.com-竞彩受注量-| www.538716.com-云南时时彩开奖记录| www.622980.com-sk彩票骗局-| www.705826.com-福彩3d天牛图库| www.785648.com-领航彩票软件| www.855892.com-定位胆是正规彩票吗| www.945163.com-20元体彩刮刮奖7| www.44kr.com-九州彩票吧-| www.0999.me-福彩3d老师-| www.7916.cm-香港快三下载| www.789409.com-成都彩色压印地坪| www.916242.com-私彩平台吧-| 发彩www.50732x.com| www.kc41.com-广州彩票兑奖地点| www.z90.cc-明彩电影院-| www.261910.com-体彩大乐透网上买| www.fn01.com-星光彩票app| www.464.com-探探上全是彩票托| www.66572.cc-北京时时彩平台| www.142568.com-彩运网cy088| www.349877.com-手机在线能买彩票吗| www.534548.com-梦秘解图七星彩梦册| www.of94.com-体彩网走势图l| www.2073.vip-香港即时彩开彩| www.22136.com-t5584彩票-| www.96382.com-福彩19014期| www.206130.com-冠军彩票送彩金| www.357517.com-不记名彩票-| www.280268.com-新彊福利彩-| www.497674.com-十三彩-| www.718135.com-苹果版彩库宝典| www.911156.com-k彩彩富民地| www.ra.com-甘肃福彩快3| www.058850.com-爱投云彩下载| www.1629.net-棋牌现金游戏送彩金| www.132823.com-生产彩色纸箱| www.312937.com-彩之网怎么样| www.491451.com-手机万能彩膜批发| www.713107.com-体育彩票大奖新闻| 万利www.32123g.com| www.428765.com-苏州福利彩票网址| www.609408.com-买彩票中奖的概率| www.62ob.com-手机上哪里买彩票| www.377913.com-体彩优秀站点| www.899551.com-彩票对冲平台| www.964209.com-福彩网是不是正规的| www.023530.com-谜彩软件-| www.150511.com-手机大小球彩票软件| www.15891.cc-休彩江苏7位数| www.97975.com-时时彩哪个软件好| www.082098.com-重庆时时彩官方电话| www.217076.com-福彩助手-| www.298519.com-腾讯彩票是真的吗| www.455522.com-买彩票能戒掉么| www.571028.com-天天彩票在线充值| www.42211.cc-彩12彩票坑人| www.023619.com-福彩七乐彩几点封机| www.102420.com-加拿大3分彩开奖图| www.162150.com-汇彩娱乐平台| www.83829.cc-蚂蚁积分换彩票中奖| www.5980.cn-彩票号码表格模板| www.360311.com-福彩近十期开奖号码| www.702836.com-竞彩跟单网-| www.9129.cc-七乐彩随机选号工具| www.26282.com-彩票的税2019| www.059132.com-nba彩票网-| www.606628.com-竞彩足球怎么停售了| www.239166.com-刷彩骗局-| www.99732.cc-香港体育彩票| www.485908.com-赛车彩票开奖网址| www.565529.com-下载湖北福彩网| www.633500.com-属马买彩票能中吗| www.721155.com-一号彩票手机客户端| www.793060.com-绵阳福彩申请电话| www.866640.com-福利彩什么时候开奖| www.936826.com-飞鱼彩票怎么玩法| www.tc58.cc-关于彩票个性网名| www.42af.com-足球彩票安卓版下载| www.717853.com-北京快三出奖号码| www.769882.com-好彩18036网址| www.922859.com-彩钢板围挡施工方案| www.og06.com-皇都彩票不能提现| www.1296.com-凤凰黑彩的登录网址| www.8982.site-中国竟彩网首页官网| www.60333.com-什么叫黑彩票网站| www.250177.com-彩99下载安装| www.370358.com-做彩票第三方支付| www.531844.com-彩票中奖偏财符| www.82847.com-彩乐乐正规吗| www.683059.com-彩票游戏网站排名| www.947392.com-福彩七加二多少钱| www.280390.com-时时彩apk-| www.27827.cc-看福彩3d开奖公告| www.681720.com-合法的网络购彩平台| www.57144.com-休闲快三分解李承红| www.941110.com-7乐彩怎么玩| 百姓彩票www.www.bxcp3333.com| www.ay56.com-彩票开奖查询彩票l| www.083189.cc-彩票20秒开一期| www.604783.com-in下载盛源彩票| www.48rn.com-历史上有张星彩吗| www.1773.cc-爱中彩票app苹果| www.482178.com-挂机彩票可以挣钱| www.880897.com-湖南刘雪龙黑彩| www.980046.com-有没有宝妈中彩票的| www.079559.com-90彩票下载安装| www.300793.com-赌博送彩金可提款| www.306160.com-澳发彩票网-| www.544708.com-369cc彩票平台| www.699163.com-华夏彩网-| www.788422.com-订婚给彩礼吗| www.719735.com-菲律宾彩票网站租用| www.126334.com-河内2分彩-| www.18522.com-足彩胜平负竞猜对阵| www.80394.com-邯郸银行买彩票| www.027790.com-中国体彩十一选五| www.408496.com-福彩春节放假时间| www.566531.com-和彩放题买一赠一| www.660755.com-阿里彩票平台首页| www.zm90.com-江西省福利彩票| www.989293.com-瑞祥彩云app| www.89vx.com-彩经网官网电脑版| www.203053.com-内蒙古福彩快三开奖|