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天

知道了
安徽快3 www.f09.com-彩78靠谱吗-| www.180.cm-每天在家做彩票| www.5279.pw-赛后结果及派彩| 手机购彩www.sjgc2.com| 彩民网www.76520p.com| www.nz01.com-中彩平台正规吗| www.577329.com-彩票排五开奖查词| www.716857.com-星空画彩铅-| www.832663.com-七彩轻云破解版| www.920095.com-华彩手机软件网下载| www.989538.com-彩漂的成分-| www.li1.com-内蒙快三新规定| www.so14.com-五星彩票开奖结果| www.26.cc-快乐双彩开奖说明| www.81dw.com-2019年体彩新规| www.2676.xyz-牛蛙彩票网站直播| www.9265.org-威斯汀福乐彩| www.173405.com-大发快三网址| www.274738.com-生肖彩开奖-| www.369102.com-体彩排三两码遗漏| www.xy2.cc-福彩快乐十分玩法| www.td82.com-快乐彩开奖号码预测| www.989135.com-这个体育彩票app| www.gz49.com-百盈彩票计划| www.4zz.com-彩票大平台-| www.75ys.com-体育彩票漏洞| www.2019.gg-亿发彩票下载安装| www.8170.top-各色釉彩大瓶| www.59116.cc-中彩易彩票-| www.055677.com-容易中奖的彩票数字| www.163365.com-七星彩奖池余额最新| www.253532.com-好彩网妹子骗局| www.345180.com-福利彩票主任鲍学全| www.22097.com-网络彩票诈骗破案| www.95306.com-七乐彩网上怎么买| www.092477.com-6768彩票网-| www.707111.com-新时时彩官网平台| www.869621.com-乐彩彩票网官网是啥| www.76pl.com-几点以后不能买彩票| www.2752.wang-福利彩票倍数001| www.9325.xyz-福彩违法-| www.85874.com-彩涂钢板规格| www.3988.live-中央批复三亚博彩| www.23278.cc-游戏新快三| www.87815.com-顺龙彩票-| www.21440.com-提现不了彩票诈骗| www.011776.com-今天彩票出什么| www.097083.com-自助彩票机-| www.210356.com-幸运快三计划网址| www.302277.com-七星彩冷热号分析| www.375267.com-福彩主播-| www.502719.com-彩友多哪家店铺人多| www.578847.com-江苏彩票店图片| www.667473.com-福彩补录事件| www.756068.com-福彩快3停售时间| www.828914.com-彩票站打错错失大奖| www.911784.com-彩客站快三网址| www.974996.com-国际高频彩票开奖| www.4942.vip-d9彩票登录-| www.11655.com-彩票小助手计划方案| www.60202.com-校长体彩福彩推荐| www.033846.com-凤凰彩世界下载| www.131802.com-成都彩礼-| www.219848.com-大发快三追豹子技巧| www.lz67.com-青海西宁快三| www.15fh.com-体彩票试机号| www.371.cm-福利彩票3d迷彩图| www.4853.biz-足彩澳客网下载| www.09598.com-类似105彩票软件| www.67729.com-刷彩票单算赌博吗| www.033196.com-福利彩票3d南方网| www.122705.com-现实中的彩神| www.206128.com-福彩双色球预测军辉| www.276291.com-各种釉彩大瓶贴吧| www.360343.com-体彩即开彩票有什么| www.458866.com-福彩3d大底网| www.846116.com-竞彩2串1概率| www.960313.com-酷彩吧双色球正规不| www.ct5.com-分分快三是否真的| www.nn83.com-红彩在线是不是骗局| www.4954.biz-网彩属于投资| www.cp5322.com-大发快三全天计划表| www.sk01.com-澳客彩票网信誉好吗| www.14if.com-福彩三d各种字谜| www.cp250.com-兰州快三开奖走势图| www.pf24.com-幸运99彩票网| www.00hh.com-彩色-| www.76ev.com-名人彩票官方登陆| www.2794.com-快三彩票图片| www.7878.live-淘宝彩票手机客户| www.32557.cc-足彩任选九奖金| www.81357.com-众彩彩票首页登录| www.026680.com-名气最大的黑彩平台| www.099110.com-福利彩票站取消了吗| www.180309.com-快三投注方法| www.266377.com-d55彩票-| www.337862.com-pc28彩讯-| www.338592.com-湖北彩票中奖未领| www.101925.com-红彩网络直播| www.207121.com-凤凰彩票提现失败| www.308024.com-重庆彩票时时彩| www.385351.com-福彩中心案-| www.685399.com-福彩平台下载| www.771050.com-最新重庆时时彩预测| www.854609.com-运彩网官网登录| www.910671.com-乐彩写真机驱动下载| www.6894.cn-看彩票开奖的软件| www.49976.com-陕西体彩中心官网| www.983416.com-幸运时时彩正规不| www.2079.shop-九千万彩票账户| www.8569.top-幸运彩票是真的吗| www.34202.com-多彩贵州公众网| www.79395.com-香港首创彩金| www.73383.com-年后七星彩何时开奖| www.174878.com-快三代理官网| www.365248.cc-七星彩大星彩票| www.488363.com-078彩票计划网| www.568419.com-三地福彩短租| www.653759.com-澳门彩票可以买吗| www.733967.com-风采彩票-| www.814827.com-5星彩开奖结果| www.890604.com-彩票全网最高倍| www.964326.com-竞彩2串1什么赚钱| 福彩网www.603154.com| www.km60.com-彩客网即时比分直播| www.n16.cn-rg彩票-| www.49ow.com-八亿彩国际官网平台| www.1232.net-江苏快三视频讲解| www.089210.com-vr重庆时时彩官方| www.192224.com-好彩3中奖多少钱| www.272050.com-立彩官网-| www.392007.com-足球彩票合法吗| www.486341.com-体育彩票胜负彩预测| www.555428.com-体彩排三奖金多少| www.611810.com-新昌县双彩乡双湾村| www.682188.com-体彩扫码出票| www.751487.com-足彩佬牛博客| www.806031.com-酷片彩票-| www.867862.com-七星彩两期相似号| www.967614.com-在手机玩黑彩输钱了| 500彩票www.50788y.com| www.365408.cc-今曰彩票开奖号码| www.464297.com-多彩娱乐用户登录| www.558515.com-彩铅画作品欣赏| www.622922.cc-爱福彩彩票开奖查询| www.678966.cc-网彩危害-| www.738558.com-七天彩的平台怎么样| www.797113.com-天天中彩票贴吧| www.2203.me-河北快三说明| www.9660.tv-彩礼十一万八吉利吗| www.88815.cc-36o彩票在线计划| www.539145.com-电视剧里的彩票故事| www.733707.com-篮球体彩分析| www.810863.com-作者中彩票书太监了| www.883102.com-一号彩票骗局| www.56dy.com-痴迷彩票人的故事| www.0214.date-百度彩彩票-| www.011032.com-腾讯彩票ios| www.107215.com-加盟网上彩票接单| www.196093.com-易彩_娱乐福地| www.272121.com-福彩快3手机版下载| www.380766.com-首存送100彩金| www.479366.cc-百度体彩大乐透| www.555273.com-乐讯吹吹七星彩圈|