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天

知道了
58福彩 www.419580.com-亚洲彩-| www.597562.com-网彩赚钱是真的吗| www.691787.com-爱心彩注册-| www.789574.com-竞彩初赔规律| www.876976.com-各种彩票玩法说明| www.961804.com-新浪福彩直播| www.cai6055.com快三走势图吉林在线| www.123236.com-在哪可以下欢乐彩| www.233681.com-汇彩app-| www.157331.com-91竞彩之家改名| www.156463.com-好彩堂独家资料| www.8161.cc-梦到彩票号码解梦| www.390083.com-彩票一注中几十万| www.jn54.com-腾讯分分彩吧| www.6jo.com-数学计算彩票中奖率| www.79oj.com-大发快三最高邀请码| www.2680.pw-彩票6288骗局| www.9094.com-七乐彩开奖详情全国| www.024596.com-彩神通内部四码官网| www.173360.com-甘肃快三一定牛荐号| www.284073.com-体彩网名-| www.377999.com-快三二不同-| www.657042.com-彩票微信二维码| www.790230.com-炫彩灯-| 乐彩网www.566305.com| www.wh23.com-体彩排3丹东全图| www.253335.com-宝马彩票登录平台| www.360850.com-幸运星座彩票w| www.456036.com-4scc彩票下载| www.555313.com-彩票买豹子-| www.627968.com-福彩计划杀码论坛| www.703117.com-竞彩足球比分完场版| www.786223.com-昨日福利彩票号码| www.867005.com-周五晚上开奖的彩票| www.952475.com-盈利彩票app下载| 500彩票www.50051l.com| www.ln88.cc-台北快三-| www.x86.cm-棋牌和彩票哪个好做| www.028.cm-最新九彩龙蛇官网| www.3657.cm-福彩返奖率是多少| www.16295.cc-官方手机购彩软件| www.153656.com-期星彩开奖结果查询| www.269573.com-彩9下载安装| www.fo30.com-中国体彩-| www.31yj.com-官方彩平台网址地址| www.51962.com-旺彩3d高手预测| www.98881.com-时时彩暴富-| www.085512.com-红牛彩票是否真实| www.188284.com-江苏快三多少组号码| www.268621.com-竟彩网计算器| www.vm72.com-江苏快三金手指预测| www.74yb.com-体彩在哪里看中奖| www.4116.biz-腾讯彩虹六号| www.dw81.com-分分快三下载方法| www.7yt.com-中国福利彩票计算机| www.94im.com-怎么举报易彩堂| www.33ei.com-福彩开奖规则| www.0671.net-快三交流吧-| www.6244.com-海南七星彩头尾合| www.403886.com-华夏彩票网站多少| www.581820.com-彩票注册送彩金58| www.360481.com-彩票站什么时候放假| www.855441.com-深圳快乐彩技巧| www.977401.com-掌上彩票安全吗| www.34hk.com-多乐彩票下载安装| www.318938.com-抚州市体彩中心| www.440084.com-洛阳体彩站转让信息| www.550713.com-福利彩票360杀号| www.651826.com-体彩点石成金| www.713273.com-大发快三历史开奖| www.788778.com-足彩交易量-| www.ir07.com-足球彩票中奖规则| www.628592.com-518彩票代理| www.9518.net-四位码彩票-| www.88648.cc-彩9彩票ios下载| www.799209.com-大发彩票群聊| www.922034.com-彩票n-| 天下彩www.854980.com| www.tr31.com-宝发彩票-| www.29lo.com-彩吧3d胆码图| www.4120.biz-彩虹一7无人机| www.09101.com-福彩计划3d群| www.261386.com-河南福彩快三技巧| www.404.site-乐米彩票客服电话| www.7335.cm-大星彩双色球走势图| www.818725.com-十四场胜负彩投注| www.900613.com-赢钱彩苹果版| www.964635.com-足彩竞彩360| 凤凰彩票www.77801n.com| www.kq36.com-五分快三是什么| www.rp37.com-河南彩色水泥板| www.51895.cc-足球e球彩中奖规则| www.045484.com-彩神通代理商| www.165231.com-安徽省体彩兑奖| www.311196.com-御彩轩手机版| www.093342.com-彩色沥青混凝土路面| www.210091.com-江苏快三登录平台| www.292351.com-3d今天的彩图| www.359274.com-体彩七星彩生日买号| www.437907.com-易彩电脑版-| www.522994.com-时时彩预测器在线| www.587972.com-网络彩票可以追回吗| www.648059.com-云来彩票下载| www.731423.com-上海体彩网首页| www.797520.com-98198彩票网站| www.858583.com-竞彩足球技巧大全| www.907669.com-7星彩6等奖多少钱| www.960818.com-中彩网中彩网图表| 趣彩网www.qucp3.com| www.dz44.com-公益福彩是违法的吗| www.1904.tv-足彩3串1输一场| www.42sh.com-苹果原彩显示在哪里| www.1687.vip-掌中彩可靠吗| www.381480.com-泰安双色球风彩| www.08.cc-体育彩票销量排行榜| www.45444.cc-彩票站中奖话术| www.17746.com-中国足球彩票开奖| www.71562.com-福利彩票怎样中奖| www.103779.com-好彩1的生肖| www.175359.com-快频彩票合法吗| www.252201.com-旺彩双色球官方下载| www.329260.com-彩票10选5怎么玩| www.405721.com-购买七星彩票| www.506333.com-茗彩注册-| www.580696.com-今日体彩排三开奖号| www.0ht.com-台湾褔星彩开奖结果| www.0660.wang-韩国1.5分彩| www.7864.xyz-时彩彩怎么才嬴| www.953057.com-快三红号有哪些号| 网易彩票www.099wy.com| www.8186.bid-好彩客网页版| www.374738.com-彩票王中王ww| www.025214.com-所有彩种-| www.188635.com-大发快三屠龙快报| www.365383.cc-彩票彩客官方端口| www.520847.com-彩票跟投群真的假的| www.cp0.com-河北快三二码号推荐| www.rm69.com-甘肃快三和值一定牛| www.28zb.com-天喜彩票-| www.93pm.com-我找到淘彩吧| www.2184.cc-广西体彩网官方网站| www.811532.com-3d彩票站吧-| www.896311.com-合买彩票软件下载| www.959478.com-易彩网广西快3开挂| www.779.space-五彩神牛3d中奖诗| www.7328.tv-彩票种类有哪些种类| www.66672.cc-怎么下载3d彩票| www.821898.com-湖北红快三遗漏| www.952824.com-福建福彩网开奖| www.cp2038.com-至尊快三网-| www.pu66.com-彩16下载-| www.74nu.com-湖北体彩前三直选| www.2600.club-爱音乐彩铃电信触屏| www.12349.cc-96彩票下载-| www.8886.date-外围足彩能挣钱吗| www.dt05.com-快彩走势图下载安装| www.h12.club-彩票过滤大师官网| www.kk61.com-易彩快三app| www.54se.com-512彩吧-| www.539503.com-彩票店可以过户吗| www.919070.com-中国最好的黑彩平台| 众发彩票www.876747.com| www.jj10.com-彩易福彩3d字迷| www.15xh.com-彩仙网开奖资料结果|