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.xy83.cc-七星彩中奖彩票图片| www.99ah.com-澳门十佳博彩| www.3980.biz-澳门博彩体育彩票| www.07868.cc-四年级中彩那天课件| www.67393.com-彩票返点怎么计算| www.102220.com-彩神争霸8官网| www.511579.com-合肥彩票官网| www.202691.com-福彩快三一定牛| www.337080.com-连中彩票手机版下载| www.465557.com-足彩量化模型公式| www.560507.com-彩票阴阳号码有哪些| www.654057.com-菲律宾的彩票网| www.766186.com-甘肃酒泉福彩快三| www.kq14.com-山东快三走势| www.x58.net-国乐彩app软件| www.72qi.com-福利彩世界是正规吗| www.3280.vip-今甘肃快三开| www.01148.cc-成都体彩中心地址| www.012923.com-彩神通今日推荐号码| www.096694.com-鑫彩网彩票平台| www.388265.com-67彩网赚团-| www.230202.com-玩福利彩票好吗| www.356161.com-105彩票计划软件| www.463147.com-时时彩刷流水赚钱| www.567252.com-沈阳旋风彩虹机| www.692183.com-彩票小助手计划方案| www.787966.com-彩票开奖历史20| www.877999.cc-往期中奖彩票| www.08yz.com-5k彩票网址导航| www.81hp.com-体育彩票全部玩法| www.2704.top-v8彩票安卓版| www.9148.cn-彩虹岛交易平台| www.71733.com-福彩综合版-| www.055511.com-福彩有哪些彩票开奖| www.178444.com-广东快乐彩开奖结果| www.282207.com-台湾三分彩开奖网| www.411620.com-竞彩推荐在哪里靠谱| www.539764.com-福州体彩转让信息| www.690082.com-爱彩乐陕西十一选五| www.782778.com-彩票极速赛车软件| www.886910.com-高频彩造假吗| www.969416.com-2118彩票app| www.jg73.com-下载爱彩乐-| www.q27.club-快三怎么看豹子| www.57ts.com-支持花呗付款的彩票| www.0887.loan-好球彩票官方网站| www.39985.com-彩票官方网站客户端| www.93556.cc-上海快三电脑版| www.5jz.cc-开彩票店要纳税吗| www.877.cm-彩铅方法-| www.7138.vip-时时彩怎样才能稳赚| www.29282.cc-内蒙古快三彩票| www.ju89.com-简单彩铅画小清新画| www.19uy.com-彩仙阁软件公司| www.811554.com-新昌双彩乡属于哪里| www.960049.com-牛彩摘彩收录论坛| www.cp0307.com-快三彩票软件破解版| www.qt59.com-福彩宗旨-| www.05am.com-青春校园彩铅画| www.74se.cc-甘肃快三是24小时| www.2017.date-和彩放题渔阳店价位| www.8350.cn-菲律宾时时彩合法吗| www.29357.cc-天津福运快三查询| www.65700.com-网络快三是不是黑彩| www.184228.com-河北快三怎么玩| www.5431.in-百宝彩双色球走势图| 网易彩票www.060wy.com| www.63tt.cc-上金科技彩票源码| www.0728.cc-爱彩网比分-| www.23429.com-纯彩票网能出黑吗| www.74298.com-彩虹旗头像-| www.680874.com-加拿大七星彩骗局| www.773619.com-福彩黑幕视频| www.917009.com-雨后彩虹图片| www.981510.com-大中华彩票下截| www.ip62.com-乐乐彩票是真假| www.z10.hk-福彩布衣天下| www.63io.com-长春彩票-| www.1152.cn-买的彩票怎么查| www.7314.biz-彩虹无人机战绩| www.25719.cc-彩库宝典ios| www.69590.com-福利彩票创始人是谁| www.179984.com-快三中奖金额对照表| www.266454.com-河北河北福彩排列七| www.400252.com-博亿网彩平台| www.115271.com-体彩顶呱刮运20| www.205445.com-喜乐彩票-| www.285929.com-亚洲五分彩-| www.381489.com-012路彩经网| www.2585.net-大星彩票综合走势| www.9393.bid-博彩客服工作难吗| www.65111.com-迪士尼彩ii-| www.032657.com-赛马派彩-| www.165559.com-1068彩票导师| www.290208.com-彩吧app-| www.380669.com-众彩娱乐-| www.503956.com-福彩验票-| www.wd7.com-一分快三预测软件| www.87677.com-买彩票害害死我了| www.047488.com-快三最长龙多少期| www.144104.com-app福利彩-| www.728565.com-彩票游戏网站| www.803581.com-掌中彩官方投注| www.876014.cc-11选5大彩鲸| www.oc22.com-彩票平台送38彩金| www.025379.com-福彩门户免费资料| www.101126.com-新华社彩票-| www.166521.com-北京体彩十一选五| www.276125.com-贵州快三预测号码| www.361127.com-福彩历史开奖号| www.444697.com-七星彩梦码查询| www.535000.cc-电玩彩票机怎么玩| www.693149.com-今天甘肃快三推荐| www.769077.com-快三14和值有哪些| www.866978.com-星期天开奖的彩票| www.930175.com-福利彩票几点开| www.983231.com-网络彩票是赌博吗| www.ew67.com-体彩排列3-| www.wa46.com-昨天足球彩票胜负| www.10qi.com-央视点名彩票| www.76bg.com-亚彩99稳吗-| www.1212.site-49c彩票官方网址| www.9828.pw-怎么查附近彩票店| www.51322.com-彩票站转让合法| www.486155.com-陕西体彩在哪里领奖| www.562817.com-福彩骰子开奖| www.630125.com-福彩3d中彩北斗| www.699428.com-七乐彩开奖三等奖| www.775560.com-彩富之家-| www.913736.com-彩票快3下载| www.974115.com-福彩3d图纸解密| www.cp9711.com-广东好彩3-| www.mp92.com-时时彩稳赚不赔买法| www.1tf.com-台湾乐透彩开奖号码| www.53jy.com-2mcc彩票下载| www.887.mobi-算卦能算彩票吗| www.240605.com-贵州快三奖金| www.807075.com-新浪彩2博客| www.878616.cc-各种彩票玩法| www.968280.com-福彩现在能买吗| 500彩票www.649477.com| www.jb51.cc-广西体彩网官方首页| www.zi77.com-r8彩票平台-| www.21kj.com-怎么进入彩票数据库| www.1773.bid-中国体彩大乐透号码| www.9715.biz-彩票联盟平台网址| www.48626.com-一赔一彩票平台| www.88671.cc-做梦梦见中彩票了| www.037029.com-成化珐琅彩-| www.136979.com-彩票店收益-| www.707772.com-签到领彩金的彩票| www.780817.com-彩虹吉他谱c调| www.852599.com-手机qq彩票在哪| www.910857.com-彩民福地测速| www.969831.com-彩票5d开奖号| www.ft72.com-福彩快三顺口溜| www.94445.com-竞彩足球计划哪里准| www.546878.com-怎么申请福彩| www.627669.com-老实时彩360| www.689037.com-日照市福利彩票中心| www.761601.com-体彩网排列五走势图| www.865111.cc-大通彩票开奖结果| www.1991.me-安徽体彩网官方首页| www.7027.com-福彩首页-|