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天

知道了
亚洲28 www.3ku.cc-彩50下载-| www.797474.com-艾彩登录入口| www.92gl.com-百万彩票是真的么| www.255338.com-滴滴彩票送28| www.398071.com-湛江七星彩开奖号码| www.289947.com-贵州快三玩法规则| www.7928.cn-网易彩票是-| www.029641.com-利赢国际彩票平台| www.352737.com-黑彩平台知多少| www.176515.com-福利快三开奖结果| www.367146.com-体彩中返奖率最高的| www.299833.com-买彩票上瘾倾家荡产| www.882714.com-易彩兼职靠谱吗| www.280385.com-重庆时时彩最稳方案| www.376589.com-博牛彩票怎么提钱| www.879541.com-网络彩票是不是假的| www.971442.com-众购彩票网登录网址| www.cp6668.cc-幸运快三走势图| www.pf71.com-彩票网骗局揭秘| 大赢家彩票www.799845.com| www.1wz.cc-重庆彩票10选五| www.70za.com-pc竞彩-| www.961570.com-彩票五行属于什么| www.cp23.com-河南幸运彩走势图| www.nq12.com-福彩选号器app| www.751084.com-玩彩票赚钱心态| www.61ae.com-轩彩娱乐平台app| www.1218.wang-豹子号今年下期彩票| www.757833.com-彩票网站提现不到账| www.761446.com-腾讯分分彩心得| www.875167.com-快三稳赚宝典| www.950833.com-中国彩票投注技巧| 500彩票网www.61655d.com| www.679270.com-彩虹颜色套路| www.788449.com-河南周口彩礼| www.868818.com-七星彩前4个号码| www.944496.com-江苏还有手游彩吗| 彩客博www.8667z.com| www.693187.com-彩票中奖短信恶搞| www.58737.cc-天天时时彩票| www.052917.com-彩票中奖就这几招| www.185667.com-福彩的宗旨-| www.480053.com-乐彩重庆走势图表| www.27pf.com-梦见老公彩票中奖| www.241877.com-内蒙快三开奖号| www.377626.com-彩票店门头照片| www.705994.com-聚星彩票团队合法吗| www.545992.com-澳客博彩app| www.266895.com-中华彩票网登录网址| www.392390.com-彩票丢了还能兑奖吗| www.516222.com-华彩手机彩票| www.588671.com-七星彩精准头尾王| www.663126.com-大蠃家彩票-| www.754186.com-彩经网工具箱| www.827359.com-彩票中怎么顺龙| www.907151.com-快三买和值稳赚吗| www.707985.com-喜来登彩票下载| www.4736.biz-凤凰彩票怎么回事| www.181913.com-安徽快三推荐和预测| www.270042.com-132彩票平台下载| www.404344.com-彩铅颜色调色表图片| www.572.cm-sina彩票cba| www.7276.cm-儿童彩虹绘画图片| www.30703.com-彩票开奖大乐透开奖| www.81374.com-八喜彩票重庆寸时彩| www.591360.com-澳门合法彩票网站| www.569213.com-腾讯分分彩开奖数据| www.681384.com-彩票该不该继续买| www.816993.com-今天晚上开什么彩票| www.393281.com-彩票昨晚的彩票| www.907707.com-吉林快三和值攻略| www.613141.com-航天彩虹股票的价钱| www.625327.com-大乐透新浪爱彩| www.db1.cc-极速时时彩开奖结果| www.ty08.com-爱乐彩11选五辽宁| www.91ls.com-天天中彩票幸运追号| www.02078.com-彩票2元网下载| www.28bz.com-私彩平台改单| www.386408.com-132彩升级模式| www.163868.com-中彩票翻身-| www.nk00.com-竞彩足球开奖查询| www.761242.com-凤凰彩票平台安全吗| www.jv01.com-中彩娱乐网站是| www.741762.com-彩票猫腻-| www.77072.com-彩票霸-| www.961809.com-qq在哪买彩票| www.u78.xyz-彩票网免费送彩金| www.159139.com-中彩网富坛免费资料| www.99404.com-彩票中奖法术| www.657134.com-全国360彩票| www.583952.com-鼎丰彩票app| www.03oy.com-时时彩欠30万| www.072078.com-彩票店如何吞票| www.209099.com-81彩票-| www.65583.cc-好彩1预测广东| www.414030.com-精彩的精的意思| www.8708.wang-利彩安全吗-| www.12cd.com-光大彩票手机版下载| www.028832.com-鸿彩网哪里可以下载| www.686805.com-苏州快三计算公式| www.762239.com-3d福彩字谜定位二| www.832663.com-七彩轻云破解版| www.895645.com-四场进球彩推荐| www.954855.com-瑞彩祥云富强彩票| 福彩网www.60007r.com| www.05as.com-欢乐的校园彩铅画| www.369293.com-5分彩是否为骗局| www.520562.com-探探上全是彩票托| www.584383.com-48彩票网址-| www.186617.com-江苏快3彩票平台| www.76584.com-中彩票是好事吗| www.208004.com-甘肃快三定牛| www.345021.com-大发彩票怎么注册| www.68wh.com-著名博彩公司| www.53139.cc-重庆时时新浪爱彩| www.058550.com-收彩报彩吧图库| www.995122.com-福彩主任被抓| www.oa17.com-龙8彩票-| www.3454.com-买彩票买哪种好| www.929197.com-玩彩app软件| 500万彩票www.96386t.com| www.668628.com-还有华人彩票网站吗| www.5741.cc-体彩选号是什么规则| www.631179.com-大玩家彩票攻略| www.745991.com-有几个彩神8| www.956116.com-金帝网络彩票| www.it75.com-彩票兑奖时间| www.872824.com-遵义彩票中奖双色球| www.977047.com-河南要彩礼吗| www.58df.com-足彩18077期| www.250328.com-感彩彩票app| www.320264.com-利博彩票app下载| www.408538.com-体彩票大乐透| www.365427.cc-手机玩快三app| www.3185.vip-彩票查询开放接口| www.8192.cn-八炫彩-| www.cl50.com-彩界小少爷独胆| www.qo34.com-褔彩3d合值表| www.170703.com-河南快三号码遗漏图| www.362279.com-福彩三地布衣图| www.190413.com-安徽快三app| www.97so.com-39彩票下载-| www.57691.cc-易盈彩票简介| www.060366.com-黑彩怎么办-| www.804465.com-彩票输改赢软件代码| www.891696.com-腾讯五分彩走势图| www.099342.com-梦见彩票中奖了| www.877393.com-快三能赚钱不要资金| www.323153.com-湖北省福彩app| www.7890.cc-四川省中国体育彩票| www.80058.cc-今晚体彩排三出奖号| www.77823.com-福彩3d七乐彩| www.753968.com-七星彩彩票早版网库| www.33729.cc-米多彩票-| www.439.in-提前预知彩票结果| www.8935.biz-彩视新版本-| www.079069.com-863人工彩票计划| 500彩票www.50054q.com| www.969866.com-彩神通做图软件| www.673.cc-重庆时时彩关闭了| www.488581.com-新浪彩票网络彩票| www.473077.com-七星808彩-| www.739646.com-神彩挣霸-| www.953367.com-彩神破解网-|