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.82ef.com-胜负彩中几个有奖金| www.6954.biz-彩控科技-| www.29337.com-彩73彩票领导者| www.82500.cc-体彩排列三杀一码| www.045219.com-全球彩票下载最新版| www.183258.com-25彩票app-| www.263197.com-体彩与福彩哪个靠谱| www.365623.cc-竞彩理财计划| www.466365.com-七乐彩特别号怎么选| www.562021.com-鸿彩直播在线观看| www.638497.com-苹果色彩图片| www.766825.com-广东体彩app| www.852838.com-中国体彩彩票app| www.906336.com-黑彩网站怎么盈利的| www.966619.com-京东彩票客服电话| 500彩票www.500103.com| www.jf47.com-体育彩票怎么兑奖| www.g15.cn-云购彩票主页| www.47gx.com-河北省福彩客服电话| www.976.cc-即开型彩票开店| www.9059.com-时时彩程序软件源码| www.51370.com-好运彩天中-| www.98691.com-竞彩足球360比分| www.072572.com-秒速快三在线预测| www.144589.com-彩票平台代理大全| www.267998.com-彩乐乐遗漏统计| www.362527.com-福彩3d万能二码表| www.456903.com-买彩票诗-| www.552284.com-爱彩乐时时彩开奖| www.659480.com-章鱼彩票-| www.751859.com-1号彩-| www.827659.com-彩名堂最新版apk| www.904996.com-刷时时彩流水赚佣金| www.964219.com-卖体彩赚钱-| 乐博彩票www.010956.com| www.ia37.com-聚网彩-| www.a80.com-最好的彩票投注网站| www.34sy.com-七星彩论坛南国| www.1314.in-大乐透预测凤彩网| www.7952.pw-七彩椒种子批发| www.29077.cc-万发彩票-| www.74526.com-三d分析预测彩吧网| www.027591.com-166彩票网登录| www.109099.com-彩泥小制作大全| www.182269.com-彩票双色球选号助手| www.264822.com-大发快三1分钟一期| www.419448.com-m彩色香烟图片| www.521645.com-足球彩票去哪里好玩| www.590507.com-中国体育500彩票| www.668960.com-一彩票走势图| www.748485.com-时时中彩96086| www.816791.com-欧美中奖彩票图| www.879416.com-彩票5app-| 幸运彩票www.982799.com| www.ki06.com-体育彩票大乐透网站| www.h18.name-江苏爱彩票-| www.39wl.com-云南结婚彩礼多少钱| www.1182.love-慱发彩票是哪里的| www.17077.cc-足彩什么时候兑奖| www.60023.com-变体神人纹彩陶瓮| www.025772.com-福利彩票如何选好| www.102032.com-足彩2串1全包买法| www.169145.com-贵州快三网站| www.275596.com-北京体育彩票店铺| www.362443.com-吉林快三直选计划| www.453838.com-竞彩足球群-| www.545549.com-怎样注册体彩投注站| www.655030.com-网投时时彩网站| www.739896.com-福彩站是怎样赚钱的| www.813643.com-宁夏体育彩票官网| www.885621.com-掌上彩票安卓| www.968461.com-福彩鲍学全-| www.tn1.com-福彩助手是正规的吗| www.qa83.com-093彩票官方版| www.41.cc-七星彩开奖号号| www.66zw.com-类似乐彩-| www.1061.net-1号彩票1hcc| www.8781.top-重庆试试彩出号规律| www.40002.com-福彩票app-| www.85863.com-福彩电话投注| www.034937.com-网上有几个彩票平台| www.134335.com-好彩混合型-| www.209025.com-快三代理一般多少点| www.282215.com-彩票33ios-| www.381842.com-彩票容易中奖吗| www.502702.com-678彩票软件| www.571578.com-大玩家彩票京东兑换| www.641369.cc-体彩柜台厂家批发| www.750030.com-福彩3d断组解密| www.815551.com-排五是福彩还是体彩| www.886233.com-掌舵者彩票群| www.973999.com-美国超级彩票| 九五彩票www.878743.com| www.hz15.com-快三害人-| www.yf12.com-派彩网快3-| www.16vj.com-排列三开奖号乐彩网| www.497.cn-体彩群骗局-| www.4161.biz-彩7网-| www.9110.org-7乐彩历史开奖号码| www.55648.com-创意水彩画图片| www.98181.cc-体彩6?1-| www.055470.com-福彩网彩种| www.151261.com-购彩8816-| www.234051.com-彩神v大发快3| www.303079.com-好彩三中奖规则| www.367712.com-最近彩票-| www.449764.com-各种彩票计划在线| www.533351.com-七星彩介绍-| www.652873.com-三d众彩网专家预测| www.728895.com-京东彩票邀请码| www.796340.com-尊彩合法吗-| www.868708.com-彩票平台系统出租| www.960633.com-彩票充值优惠2| 大玩家彩票www.84499x.com| www.dm39.com-官方快三有哪些省份| www.tu24.com-爱彩乐电脑版| www.19.cn-正规彩票店卖私彩| www.59kn.com-海南七星彩梦册查奖| www.920.cc-彩票大神微信| www.4420.in-玩快彩真的能赚钱吗| www.9177.loan-七星彩长春-| www.014740.com-七星彩网上购买| www.080495.com-奇门六爻法测彩实例| www.137610.com-福彩主任如何作假| www.207128.com-凤凰彩下载-| www.268869.com-go彩票违法吗| www.384234.com-体彩大乐透广告语| www.498908.com-谁有购彩网邀请码| www.560239.com-非凡体彩走势图| www.619720.com-彩票开奖专区百度| www.682599.com-手机足彩怎买| www.753290.com-九州彩票手机app| www.868695.com-彩879彩票骗局| www.921632.com-中彩票的密码| www.974527.com-彩运来手机版下载| www.cp9955.cc-福彩十分快乐走势图| www.lr75.com-中华彩票网站| www.b25.online-贵州快三跨度走| www.25rf.com-华彩一点通-| www.614.mobi-时时彩下期出号规律| www.3681.biz-重庆百宝彩-| www.8444.loan-合伙买彩票中奖纠纷| www.44735.com-福建体彩领奖程序| www.85085.com-彩票二维码泄露兑奖| www.029222.com-手机彩票软件害人| www.097599.com-体彩排列五直播开奖| www.155437.com-中国体育彩票飞鱼彩| www.267785.com-彩礼新规定-| www.338413.com-福彩30选5方法| www.396862.com-多彩宝小助手下载| www.513391.com-快三外围玩法| www.572108.com-国模雨晴拍的彩票| www.633124.com-彩票打菜是什么意思| www.689944.com-谁有玩快三的群啊| www.758826.com-买彩票中奖的新闻| www.871447.com-桂平彩票中了2亿元| www.938473.com-福建体彩彩民论谈| www.984310.com-福建快三号码统计表| www.hm.com-福彩快三是不是赌博| www.kn27.com-足彩竞彩资讯中心| www.yv13.com-彩票归邓家管| www.12ki.com-800彩下载平台| www.69pb.com-澳客网彩票网官网| www.0027.biz-彩票数字几位|