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天

知道了
500彩票竞猜 www.072628.com-世纪佳缘上说买彩票| www.213965.com-三分快三计划稳定| www.71580.com-网易彩票官网网址| www.094554.com-玩3d彩票什么网站| www.185839.com-玩快三教训-| www.289259.com-3福彩开奖-| www.525308.com-今彩票开奖结果查询| www.665557.com-七乐彩随机一注| www.763509.com-华宇彩票代理奖金| www.881549.com-辉煌彩票h-| www.975743.com-河南太康县彩礼| www.hu65.com-快三注册送彩金| www.k44.net-福彩十分快三遗漏| www.030091.com-优彩社区跑狗论坛| www.160280.com-福彩3d技巧偏差| www.323113.com-马来分分彩开奖记录| www.412781.com-竞彩分析师平台| www.527594.com-手机256彩票官网| www.651380.com-搜索福彩独胆王| www.751254.com-博牛彩票团队| www.477793.com-福利彩票工作怎么样| www.612939.com-小彩牛干红葡萄酒| www.718509.com-彩虹寓意着什么意思| www.807660.com-彩票中奖之后| www.891015.com-至尊云彩票-| www.966621.com-吉林快三群犯法吗| www.cp3302.com-一分快三是真是假| www.pn34.com-3d彩乐乐今天预测| www.22gv.com-七星彩中奖票样| www.683.net-红旗彩票快三入端口| www.5407.vip-今日开七星彩结果| www.15338.com-彩库宝曲开奖视频| www.63882.cc-今天竞彩14场| www.067978.com-彩票系统定制| www.141598.com-天天好彩二四六| www.223683.com-燕赵福彩快三| www.306206.com-彩6com彩票-| www.382819.com-新浪胜负彩彩票| www.557425.com-福彩中奖等级| www.633620.com-d8彩票靠谱么| www.700318.com-优信彩票在线登陆| www.774118.com-户外游戏彩虹伞教案| www.935687.com-福彩3d交流-| www.994804.com-好客彩ios-| www.ca41.com-赢钱彩app-| www.vh03.com-天津福彩中心| www.13wk.com-直播七星彩开奖| www.516.in-o38彩票软件下载| www.4862.biz-全民彩票登录| www.09269.com-933彩票是黑平台| www.55049.com-体彩排列5怎么玩| www.004759.com-体彩排列三遗漏号码| www.080620.com-南洋彩哪里看开奖| www.151293.com-天天时时彩小助手| www.306389.com-做梦买彩票中奖| www.380124.com-湖北快三开奖漏洞| www.517209.com-4146牛彩-| www.588629.com-5快三下载-| www.665013.com-703彩票资料网| www.739472.com-体彩竞彩店-| www.811761.com-七乐彩复式11中6| www.877869.com-重生之彩票起家| www.ai48.com-七星彩前四位口诀| www.so53.com-今日彩票预测3d| www.14un.com-玩时时彩靠谱吗| www.98hz.cc-炫彩福字动态壁纸| www.3500.pro-红旗网彩票官方网址| www.is30.com-口袋彩票合法吗| www.12qq.com-手机下注彩票| www.0244.org-彩票餐馆-| www.13405.com-金誉彩票网pk10| www.61350.com-网络购彩怎么举报| www.25.cm-网上私彩害了多少人| www.674.me-七星彩晚上几点停售| www.6736.cc-好的彩票软件| www.24253.cc-宝马彩票违法么| www.71676.com-163彩票开奖| www.020546.com-双色球玩法彩票| www.098365.com-中彩福骗局-| www.170649.com-马来3分彩开奖| www.345877.com-皇家快乐彩开奖记录| www.438811.com-平台彩票代理加盟| www.537165.com-大平台彩票网| www.652777.com-梦到彩票号码的原因| www.743198.com-糖果派对彩金怎么算| www.825192.com-山西运城快三查询| www.909161.com-七星彩玩发-| www.986472.com-七1星彩开奖结果| www.bd.com-吉林快三玩法说明| www.vd15.com-正规的彩票网站制作| www.23my.com-132彩票好不好| www.0580.cn-明代釉下五彩瓷| www.8128.xyz-北京时时彩平台官网| www.33478.cc-彩票预选走势图软件| www.83379.cc-买哪个彩票容易中奖| www.051458.com-500购彩注册| www.420044.com-彩票app靠谱吗| www.522991.com-时时彩开奖走势图图| www.619392.com-彩票逆向思维| www.692192.com-彩乐瀑网-| www.771791.com-腾龙时时彩做号官方| www.898114.com-买彩票输了几十万了| www.957813.com-真帝王宝图彩吧图库| 天天彩票www.2373d.com| www.eb02.com-广西十分彩开奖记录| www.1738.in-鸿发彩票是真是假| www.59117.cc-中彩易-| www.027759.com-093彩票怎么没了| www.104857.com-360足彩胜负彩| www.170711.com-甘肃福彩快3走势图| www.552047.com-乐赢彩票网-| www.632252.com-500快三彩票| www.699212.com-体彩开奖中国| www.772733.com-最准的福彩3d群| www.870413.com-金凤凰彩票开奖查询| www.952661.com-必赢彩网-| www.994844.com-神彩福牛双色球推荐| www.yj4.cc-福彩快乐十分钟玩法| www.qv68.com-pc是彩票的意思吗| www.03mv.com-中信彩票可靠吗| www.68yy.com-博彩十大公司| www.0519.wang-头彩网能赚钱吗| www.8674.org-福彩画谜总汇大全| www.a93.net-博彩是什么-| www.79ni.com-七星彩内部信息册子| www.3344.hk-体彩兑奖指定银行| www.878360.com-九号彩票平台欺诈| www.963372.com-快三哪个网站| 彩票58www.582006.com| www.lp25.com-中彩吧2020平台| www.j77.xyz-深圳福彩中心地址| www.31qn.com-什么彩票星期六开奖| www.1988.site-pp彩票出问题了吗| www.6703.cm-分分彩厘模式| www.16110.com-彩票稳赢计划| www.56749.com-赢彩票网-| www.062917.com-淘彩app是骗局| www.140078.com-彩票777www| www.213144.com-彩票平台搭建一条龙| www.283411.com-七乐彩怎么中奖规则| www.384996.com-圆梦七星彩交流专区| www.kk64.com-彩票驿站主页| www.128645.com-幸运五星彩开奖软件| www.674676.com-竞彩刷佣金方法| www.97qi.com-哪些彩票网有送彩金| www.2966.org-甘肃福彩兑奖地址| www.922284.com-江苏快三开将号| 中彩网www.6611e.cc| www.nq78.com-河南新快三一共几注| www.20uh.com-758彩票相关| www.033.online-福彩怎么申请| www.2274.cn-彩票梯子计划软件| www.6755.cn-易网彩票幸运选号| www.15726.cc-浙江体彩6+1开奖| www.55270.com-快3彩票手机软件| www.96402.cc-2018福彩事件| www.055277.com-捕鱼送彩金-| www.384944.com-七星彩七金码版| www.499887.com-网易彩票欢乐豆| www.566861.com-大乐透河南体彩网| www.633581.com-244大众彩票| www.730717.com-重庆时时走势图彩经| www.800053.cc-褔体彩开奖结| www.866781.com-昨天开什么奖彩票|