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.2972.cn-甘肃福彩主任| www.865386.com-分分彩开奖号码| www.31xb.com-星期一彩票开那些| www.455749.com-微购彩官网下载| www.174511.com-河北快三走势图新版| www.673840.com-一字枋心彩画| www.838214.com-彩票吧app下载| www.945959.com-体彩混合走势图| 双龙娱乐www.sj119.9slyl.com| www.sm92.com-江西时时彩下载| www.85278.cc-新浪彩票彩票竞技| www.1886.site-彩球提现靠谱吗| www.d19.org-三分快三预测| www.302.press-港彩正版资料第一份| 网易彩票www.07163w.com| www.3547.com-83彩官网下载| www.vd66.com-易彩网官网-| www.15315.com-彩票合买能赚钱吗| www.859801.com-中博彩票app| www.3966.xyz-东北结婚彩礼用途| www.579352.com-高手彩票论坛| www.28.com-优彩区-| www.32659.cc-重庆结婚要彩礼吗| www.967011.com-安徽快三输了很多钱| www.2642.vip-糖果彩指导员| www.656629.com-m5彩票下载-| www.23re.com-意大利幻彩绿| www.ps22.com-鸿彩网平台-| www.5450.top-彩虹六号战绩查询网| www.28fo.com-腾讯腾讯分分彩计划| www.948203.com-国家福彩网-| www.bm17.com-凤凰彩票app下载| www.423040.com-体彩超级大乐透官网| www.620261.com-顶呱刮彩票app| www.060979.com-河南福彩手机网| www.007014.cc-彩报3d图库老虎图| www.ha5.com-玩彩胆神-| www.800686.com-快3是福利彩票吗| www.923365.com-包头开彩票站多少钱| www.fg8.com-福彩3d开奖号码| www.087712.com-竞彩之家app新版| www.148.net-临沂彩虹谷值得玩吗| www.6779.com-彩票对子什么意思| www.2796.wang-买彩票图片大全| www.588054.com-彩票独胆-| www.307587.com-湖南体彩论坛排列三| www.488731.com-福彩7乐彩开奖时间| www.591022.com-睢宁双沟彩票中奖| www.678217.com-福彩3d胆组怎么做| www.786442.com-三地彩票定胆| www.873744.com-彩票源码平台出租| www.964013.com-彩虹代表什么| www.3753.xyz-七星彩开奖什么频道| www.2932.org-小黄人彩票机赚钱吗| www.685236.com-历史’3d彩票| www.3590.cm-世界上中最高彩票| www.2876.cn-内蒙古快三新玩法| www.04fc.com-谜彩天地高清图| www.398.date-下载乐彩-| www.7034.biz-244大众彩票| www.341797.com-诺亚彩票平台| www.11488.com-彩票网站系统出租| www.358795.com-新浪彩票2018版| www.619160.com-中国体彩兑奖青岛| www.741922.com-掌聊彩票骗局揭秘| www.387767.com-天天买彩票买不了| www.371081.com-体彩天下正规吗| www.5566.net-体育彩票大乐中奖人| www.6596.cm-属猪买彩票幸运数字| www.28609.com-彩票中奖金额| www.91371.com-五福彩彩票下载| www.067208.com-黑彩平台大全| www.180253.com-江苏体彩彩票| www.290208.com-彩吧app-| 盈彩票www.355225.com| www.429488.com-好彩五分快三| www.522383.com-5亿彩票是骗人吗| www.11712.com-辽宁福彩网快乐12| www.n49.club-用户注册中福彩票| www.969783.com-义乌彩票店转让信息| www.4567.club-中国什么彩票靠谱| www.533734.com-g500购彩平台| www.597379.com-满堂彩彩票平台网址| www.661725.com-竞彩买比分的绝招| www.726793.com-乐彩缩水软件| www.791023.com-下载广西福彩| www.856589.com-中国体彩七星彩走势| www.922638.com-365彩票安卓下载| www.973225.com-彩虹app-| 51彩票www.751898.com| www.qr68.com-l23网体彩福彩| www.25vr.com-彩票的单双是什么| www.388.online-炫彩铃声ios| www.991521.com-北京赛车送彩金| www.322545.com-盛兴彩票v3入口| www.nr00.com-极速快三计划官网| www.828682.com-胜负彩兑奖-| www.359912.com-七星彩是一元一注吗| www.505664.com-黑彩能破解吗| www.576776.com-彩票维护需要多久| www.698478.com-嘉兴市福彩中心| www.862028.com-七乐彩各期中奖号码| www.43ga.com-篮球体彩奖金| www.788078.com-特彩吧app金彩网| www.883238.com-鸿彩灯光官网灯库| www.961497.com-彩票中奖绝招| 七彩www.53900a.com| www.kl46.com-王牌彩票是违法的吗| www.zj50.com-江苏快三定胆方法| www.11fk.com-新世界彩票平台| www.684408.com-七彩开奖-| www.798981.com-时时彩后三技巧| www.883271.com-鸿彩直播平台下载| www.977584.com-亿菲彩票-| www.sl49.com-幸运五分彩是谁开奖| www.26dx.com-大发快三软件制作| www.0954.vip-彩缘论坛技巧| www.8806.cc-彩6彩票苹果下载| www.630466.com-就业肘报3d天天彩| www.3103.org-众发彩票怎样注册| www.02834.com-彩票中奖哪里领| www.78423.com-八仙过海艳彩| www.026558.com-彩票注册送彩金| www.127034.com-可彩慧-| www.92jo.com-彩票性缘无删减| www.3860.vip-延边省福彩中心| www.660350.com-章鱼彩票官网页版| www.bz32.com-兰州快三开出大奖| www.26779.com-七星彩怎么玩算中奖| www.198781.com-时时彩走势图怎么看| www.340683.com-拉萨福彩如何申请| www.463.bid-m5彩票中心-| www.5538.net-澳门彩票大全| www.180456.cc-快三怎么自动投注| www.99gc.cc-彩天地娱乐-| www.6765.com-百度如意彩正规吗| www.2348.me-福彩3d二码分沁图| www.239232.com-江苏快三算赌博吗| www.314757.com-一般怎么买篮球彩票| www.388865.com-山东体彩彩票大管家| www.541122.com-凤凰彩票有没有诀窍| www.674146.com-彩票走势图开奖公告| www.739681.com-帝豪ll时时彩| www.804376.com-易彩自动投注软件| www.873630.com-页导青蛙彩票网站| www.955434.com-7月足彩赛程| www.999428.com-江苏e球彩技巧有吗| www.zv5.com-足彩14场推荐| www.004503.com-彩票信用玩法安全吗| www.097052.com-牛彩网大全-| www.943054.com-百姓彩票登录| www.993088.com-网易彩票怎么赚钱| www.kn1.com-江苏快三多久一期| www.ld71.com-凤彩网app-| www.187589.com-时时彩改时间了| www.301352.com-天天彩票骗局揭秘| www.108698.com-28高频彩-| www.67xq.com-自制化妆品彩妆| www.24224.com-彩票模拟选号器软件| www.31489.com-厦门福彩店转让| www.498850.cc-足彩竞彩缴税多少| www.996848.com-爱彩比分直播| www.231337.com-快三分分如何跟计划| www.610997.com-海南体育彩票视频|