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.4537.live-七星彩号码开奖结果| www.46526.com-pk软件彩票下载| www.006538.com-2019年彩票整顿| www.092096.com-248彩票首页| www.202310.com-贵州省体育彩票中心| www.299234.com-qq彩票竞猜维护| www.369905.com-福彩作假视频哪一期| www.468638.com-福彩开市时间| www.565222.com-河南泳坛夺金派彩网| www.636388.com-彩虹无人机官网| www.893422.com-下载官方彩票平台| www.963303.com-七乐大发快三下载| 大赢家彩票平台www.329209.com| www.jv75.com-快三走势一定牛| www.d16.cc-快3彩票程序| www.44gb.com-七彩蓝田项目| www.893.cx-彩库宝典旧版下载| www.5925.biz-彩61平台能赚钱吗| www.17797.cc-体育竞彩推荐app| www.65178.com-三d开机号乐彩网| www.121107.com-福彩3d高手群微信| www.201715.cc-押大小单双正规彩票| www.282166.com-51彩票实时计划| www.397684.com-福彩3d谜语前期| www.527896.com-重庆时时彩当前遗漏| www.620591.com-如意彩票网是真的吗| www.699657.com-找时时彩微信私人群| www.783956.com-百乐彩是正规网站吗| www.858931.com-彩票开奖软件下载| www.922535.com-红8彩票app-| www.983710.com-幸运时时彩开奖号码| www.73zm.com-鞍山3d黑彩-| www.1770.cm-什么是彩票流水| www.8800.cm-中彩网开奖结果记录| www.47168.cc-彩票大本营-| www.95000.cc-高频彩票大数据| www.062801.com-盈盈彩开户-| www.176205.com-幸运快三网-| www.268052.com-福彩山东群英会吧| www.365174.cc-安徽福彩快3加奖| www.460406.com-实亿彩票app下载| www.555565.cc-彩票9999-| www.630158.com-竞彩足球看亚盘心得| www.707004.com-辽宁全运彩11选5| www.788438.com-七星彩专家推荐号| www.869329.com-中彩网快三下载| www.999903.cc-彩票服务平台| www.vq8.com-大马彩票安装| www.rl17.com-快十分钟彩票有哪些| www.11yg.com-福彩时时采彩| www.86ch.com-聚像彩登录-| www.2635.pw-时时彩自己改单| www.8468.cc-欧洲杯彩票中奖图片| www.61461.com-中华彩票平台| www.023456.cc-万豪福彩助手| www.099249.com-时时彩杀码诀窍| www.171817.com-贵州体彩下载| www.281925.com-今日彩票预测中奖号| www.369631.com-天霁彩票网手机版| www.469827.com-创明彩票-| www.555890.com-我要机选一注七乐彩| www.626440.com-福彩3d小号走势| www.698786.com-画画图片大全彩铅| www.776842.com-时时彩前三走势图表| www.913369.com-福彩吧提款失败| www.975248.com-体彩自助终端机| www.ag19.cc-经彩网彩票开奖| www.sb12.com-体彩独胆预测| www.10rn.com-四季彩登录电脑版| www.81rv.com-聚彩彩票靠谱吗| www.1896.top-2020彩票网苹果| www.7401.org-彩02下载链接| www.23435.cc-时时彩提现规则| www.67244.com-绵阳市福彩中心| www.085535.com-甘肃快三和值推荐| www.150968.com-彩票稳赚忠告| www.252391.com-关于买彩票的新闻| www.323568.com-大奖彩票站-| www.392748.com-彩铅画真人教程| www.590067.com-竞竞彩网比分直播| www.665598.com-星空彩票手机网址| www.739249.com-福彩快3网投招聘| www.810854.com-购彩骗局-| www.880800.com-哪些是黑彩票网站| www.986890.com-234官网彩票| www.cp2210.com-福彩快三技巧心得| www.lx06.com-168彩票安全吗| www.i90.com-河北体彩七星彩| www.38cm.com-彩神挣霸8-| www.1090.biz-上海银彩通手机版| www.7488.org-上海福彩实体店| www.22488.com-大学生中彩票的密码| www.64703.com-女足世界杯有竞彩吗| www.037978.com-财政部彩票-| www.122989.com-福彩公益金管理| www.193107.com-乐购28彩票网| www.267913.com-湖北快三一定牛走图| www.371844.com-合肥市体彩转让| www.470046.com-足彩外围哪里合法| www.553751.com-彩快3彩票网站官网| www.618746.com-永久彩票app| www.685305.com-安装福彩3d彩票| www.760927.com-广东好彩1app| www.892569.com-推荐合法彩票软件| www.956991.com-567cc彩票-| 新浪爱彩www.97775.cc| www.cv54.com-亚洲彩票合法吗| www.tg94.com-花式休闲快三| www.8lk.com-新宝彩票软件下载| www.61ns.com-七星彩票开个奖结果| www.0051.net-彩票几组号码| www.392839.com-长春彩票中奖去哪领| www.974623.com-排列三众彩网预测| www.eq08.com-快三秒热水器价格表| www.208004.com-甘肃快三定牛| www.735032.com-网络时时彩诈骗案| www.804081.com-网上咋买体育彩票| www.875074.com-恒博彩票网骗局| www.969362.com-德国彩虹计划| 彩票5www.550414.com| www.gm99.com-河南安阳彩礼价目表| www.xd39.com-中彩在线提现快吗| www.11vw.com-彩票彩八下载安装| www.75gt.com-易彩票快三开奖查询| www.0936.net-千禧彩票网官| www.07868.cc-四年级中彩那天课件| www.48246.com-竞彩优化工具| www.88228.cc-彩票19035-| www.035203.com-体彩4串4-| www.140012.com-彩票公式赚钱真的吗| www.209356.com-福彩排列五开奖| www.276281.com-时时彩万为规律口诀| www.376001.com-宣城体彩中心主任| www.487021.com-中国竞彩几点停售| www.555530.cc-神彩网合法吗| www.612951.com-福彩3d千元晚报| www.677097.com-昨天的福利彩票号码| www.745984.com-天天中彩票正规版| www.806729.com-彩票站兑奖额度| www.872966.com-彩票时时彩网上购买| www.989438.com-香港门户彩票| www.cai6655.com长春快三开奖视频| www.im13.com-微彩吧app-| www.xm39.com-今晚大乐透彩票号| www.10ea.com-178彩票网官网| www.69is.com-彩虹六号2.5倍镜| www.0238.cc-天天赢彩票手机版| www.26638.cc-七星彩辅助-| www.63716.com-足彩竞猜app实用| www.024141.com-小鹿工具彩票| www.087111.com-五福彩新版下载| www.138844.com-卖彩票提成是多少| www.204822.com-快三平台骗局| www.266408.com-河北福利彩票网官网| www.382098.com-男子借钱买彩票| www.491026.com-海南省七星彩梦册| www.555493.com-七星彩中奖概率太低| www.612517.com-1516彩票网下载| www.672632.com-新加坡彩票开奖时间| www.736909.com-大众彩票网审核| www.798547.com-广东福彩怏乐十分| www.861694.com-体育彩票店图片| www.913166.com-彩客彩票真实吗| www.965622.com-360彩票导航导|