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天

知道了
江苏11选5 www.52005.com-吉林快三开奖奖金| www.154029.com-彩票源码稳赚高收益| www.87795.com-彩网网-| www.110261.com-乐点彩-| www.660579.com-足球胜负彩比分直墦| www.fo96.com-今日竞彩足球推荐| www.870.pw-彩票数学公式方法| www.104578.com-福彩主任冯亚平| www.869494.com-今天七星彩老鼠精图| www.951640.com-彩票平台出租可靠么| www.35em.com-南海网七星彩票论坛| www.8212.top-大富彩票黑平台| www.36913.cc-快三速查表设计图| www.400629.com-澳客足彩网电脑板| www.524731.com-凯利公式彩票| www.33681.cc-五百万彩票网投注| www.602306.com-福利彩票利润怎么算| www.325276.com-合买彩票靠谱吗| www.865908.com-深圳熊猫彩票| www.783208.com-七乐彩历史同期号| www.926516.com-开福彩店-| www.mc71.com-七星彩版早版| www.30as.com-初学彩铅画怎么选笔| www.2979.cm-重庆时彩开奖| www.9973.loan-请搜索福利彩票| www.898984.com-彩票三b开机号| www.969928.com-中国福利彩票真实| 500彩票www.500599a.com| www.5343.org-怎么从淘宝买彩票| www.15302.com-吉林快三全天计划群| www.68723.cc-9购十分彩合法吗| www.044329.com-足彩让球规则详解| www.224469.com-快三猜不出好| www.vw79.com-快三输了很多钱| www.655107.com-幸运福星彩版| www.910086.com-南京彩虹中心志愿者| www.486227.com-极速赛车是什么彩票| www.7xe.com-中彩票后离婚| www.hy49.com-体彩福彩综合走势图| www.08050.com-澳洲f1彩票-| www.9666.wang-彩独下载-| www.58951.cc-福彩3d定百位技巧| www.9394.host-双色彩票玩法| www.ow07.com-福彩3d试机号破解| www.g51.cc-彩票排3走势图开奖| www.63765.cc-足彩买量比-| www.766906.com-鸿运彩票网页版| www.065896.com-福彩店经营心得体会| www.42xp.com-七彩网络能查成绩吗| www.154688.com-足彩论坛-| www.283269.com-2015够力七星彩| www.80137.com-博彩怎么玩-| www.958343.com-福彩3d代码是什么| www.9948.biz-57期福彩-| www.006921.com-我的关注彩票开奖| www.92wy.com-彩照是什么底色| www.5011.la-上和彩票-| www.06638.cc-澳门赌彩app| www.4vm.com-如何看体彩是否中奖| www.3708.vip-休彩排三2元| www.139455.com-竞彩足球安卓版| www.636.cm-时时彩十二生肖| www.212014.com-盈盈彩票网首页| www.62um.com-北京快三号码遗漏| www.906910.com-天津有快三么| www.gv81.com-新彩票-| www.p91.wang-彩票开奖太湖| www.60tj.com-双色球维彩视频宝典| www.1486.net-老时彩开奖结果| www.8427.cn-体彩彩票中奖分布| www.327640.com-福彩体彩开奖公告| www.278.tv-彩妆连锁加盟品牌| www.4242.cc-大乐透杀号唯彩会| www.11098.cc-足彩在哪找-| www.563052.com-肥城体彩三亿| www.194918.com-体彩上海11选五| www.280085.com-五星彩票开奖号码| www.87qx.com-在淘宝上怎么买彩票| www.2939.wang-彩之源-| www.936139.com-微信带你玩彩票赚钱| www.cai2525.com湖北精彩十分| www.mw60.com-彩票88-| www.358884.com-七星彩趣味图网址| www.39139.cc-中彩彩票怎么充值| www.314993.com-彩票怎么玩法| www.497879.com-44557鸿运彩票| www.496789.com-下载58彩票com| www.96jk.com-高频彩票吧-| www.5872.xyz-延吉中彩票-| www.044044.cc-3d彩民乐钱图| www.386099.cc-天津时彩最快奖网| www.126824.com-快三在线计划网| www.213851.com-快三中彩网apk| www.792656.com-快三数据专家触屏版| www.948990.com-福利彩票3d下载| www.gr97.com-快三网赌-| www.79nu.com-福利彩票快3陕西| www.03498.cc-是否应该买彩票| www.790.mobi-易点彩票网-| www.059412.com-辽宁省福彩12选5| www.96327.cc-彩票识别码研究| www.2819.cn-天天彩票维护时间表| www.85882.cc-我附近的福利彩票站| www.555324.com-彩哥计划官方| www.645933.com-足彩研究心得| www.290102.com-大发快三不给提现| www.874712.com-人人中彩票软件| www.999291.com-下彩网安卓客户| www.gn88.cc-七乐彩开奖走势图| www.033202.com-七乐彩走势图表新浪| www.902338.com-青海快三今日未出号| www.206775.com-彩票被骗资金追回| www.507153.com-非凡彩瓦-| www.477737.com-乐喜彩票是骗子吗| www.888983.com-彩福彩票靠谱吗| www.977895.com-开彩票店的风险| 天天彩票www.943893.com| www.527666.com-足彩2串1带7串8| www.4699.cm-58彩票互动大厅| www.295281.com-吉林省快三开奖说明| www.498418.com-香港副利彩票| www.08ky.com-河北福彩首页| www.80le.com-boss直彩彩票| www.1371.cn-vr彩票是不是很假| www.7768.xyz-35彩票网页版| www.302815.com-徐州彩票最大奖| www.ak34.com-河北快三儿-| www.7575.in-宏盛彩票分析软件| www.716771.com-手绘彩铅动漫樱花树| www.805956.com-九五计划彩票| www.878617.cc-上饶体彩领奖在哪里| www.932974.com-马来西亚南洋彩规律| www.872785.com-uu快三稳赚不赔| www.944868.com-正规彩票店卖假彩票| www.987082.com-正规网购彩票平台| www.vw.cc-皇都彩票网址人口| www.672758.com-江西七星彩中奖| www.768234.com-特区彩票808| www.846587.com-北京单场足彩单场| www.905801.com-瑞祥彩票app| www.963574.com-被网络彩票骗了| www.824112.com-快三彩票群网| www.4682.in-我去彩票站下载| www.497361.com-十三彩平台-| www.565637.com-苏宁智慧彩票| www.660502.com-分分彩选号-| www.766002.com-彩之源app注册| www.856383.com-七星彩梦册网查码| www.909308.com-宝马彩票平台靠谱吗| www.975582.com-手机买福彩怎么付款| www.uc44.cc-全民汇彩票下载| www.mj56.com-好彩烟东北有卖吗| www.719235.com-描写彩虹的好词| www.2948.org-彩金狮王游戏机二代| www.5110.love-天津彩票官网| www.13755.cc-福彩天地报双色球| www.6398.cn-山西快三走势| www.34734.com-幸运彩票网注册登录| www.192334.com-快三和值跨度图表| www.8965.biz-如意彩票人工计划| www.4511.biz-七乐彩36期-| www.9289.org-重庆时彩违法吗| www.1373.vip-现任福利彩票主任| www.832525.com-纯七彩图片大全|