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.454006.com-彩票3d水果图| www.656524.com-快3彩票二维码| www.826016.com-七星彩购买软件| www.916825.com-亚洲彩票信得过吗| www.994678.com-辉煌彩票平台| www.bx65.com-派彩免费版-| www.z83.cc-福、彩3d走势图| www.456.host-福彩双色球单价| www.6046.org-3d彩票图纸今天的| www.70806.com-彩票注册就送18| www.043542.com-海南梦兆查询七星彩| www.134545.com-好彩蓝莓价格| www.vv87.com-有导师代买彩票挣钱| www.781643.com-福彩新规则-| www.471444.com-澳门三色彩-| www.338987.com-正版体彩排三藏机诗| www.545719.com-彩票群公告怎么写| www.723511.com-江苏彩票中奖纪录| www.851833.com-时时彩概率分析软件| www.968121.com-希腊时时彩开奖软件| www.qv20.com-qq分分彩官网开奖| www.29163.cc-搜狗彩票投诉电话| www.95337.com-福彩3d太湖字咪| www.072872.com-四亿彩票送41| www.105651.com-新浪彩票图表走势图| www.788449.com-河南周口彩礼| www.981809.com-大发彩票是违法的吗| www.32uq.com-手机能买彩票吗| www.66759.com-福彩中五元兑奖流程| www.051652.com-19044足彩-| www.136342.com-广西体彩网上投注| www.219124.com-彩票注册-| www.108912.com-彩泥大全-| www.591135.com-七星彩012路| www.171133.com-七星彩近500期| www.1113.pw-竞彩腰斩比赛怎么算| www.94qy.com-093彩票代理| www.752173.com-中彩堂资料网址| www.917758.com-七星彩内部打击私彩| www.jm49.com-赢发彩票网站| www.e45.cn-七乐彩按顺序么| www.33wi.com-彩票图片制作教程| www.483928.com-联运时时彩-| www.353406.com-凤凰网彩手机版| www.567374.com-南京福利彩票投注站| www.657092.com-中国福利彩票号码| www.767714.com-旺彩四肖8码| www.845728.com-湖北福彩中心在哪| www.916829.com-如何举报彩票网站| www.979034.com-无嘴好彩-| www.xl02.com-彩控甘11选五| www.34gt.com-华龙彩票-| www.096699.com-神彩福牛预测| www.180012.com-体彩网站-| www.254805.com-好彩堂论坛-| www.328303.com-乐彩论坛下载安装| www.972795.com-最新彩虹世界app| www.3412.wang-好彩运官网下载| www.32545.com-中彩票骗钱-| www.896543.com-广东快三计划群| www.983200.com-新盈彩提现-| www.lm92.com-中彩网的网址| www.19em.com-卖私彩如何盈利| www.1232.in-123官方彩票网| www.78499.cc-排三三句话双彩论坛| www.948069.com-众彩网排列三杀码| www.529004.com-小六壬测彩票的号码| www.646964.com-足彩12转9算法| www.891922.com-晨兴彩票-| www.230430.com-新3d彩吧-| www.629386.com-福彩奖池中有多少钱| www.781041.com-江西快三的平台| www.889380.com-如意彩票平台靠谱吗| www.963755.com-彩虹羽泉吉他谱| www.ej20.com-北京快三群-| www.17yo.com-快7彩票走势图| www.93ub.com-易彩云app-| www.2847.cn-彩虹糖蓝色什么意思| www.8429.vip-百度彩票中奖| www.40934.com-亚慱彩票-| www.78868.cc-ok彩票最新消息| www.029162.com-8体彩屋是真的吗| www.099065.com-易彩彩民福地| www.75yb.com-体彩的开机号| www.799577.com-福彩快二-| www.45xm.com-m彩色香烟图片| www.4949.tv-梦到彩票中奖| www.005097.com-728彩票网页| www.124020.com-河北体彩排列七| www.296669.com-彩专家大牛在线计划| www.565397.com-彩票黑客软件下载| www.675826.com-福彩走势图三地| www.782102.com-叶贝斯定律与彩票| www.909554.com-福彩3d资料大全| www.315966.com-7乐彩票开奖结果| www.zo58.com-时时彩五星一码必中| www.7557.xyz-卖体育彩票传销| www.60517.cc-网上代买彩票| www.057881.com-福彩三d预测专区| 亿彩www.6832z.com| www.858944.com-彩票历史查询器工具| www.023464.com-百胜彩票网站| www.ku7.com-江苏体彩e球彩规则| www.22993.com-王者彩票苹果手机| www.969024.com-众彩黑我钱-| www.131270.com-开封订婚和结婚彩礼| www.257071.com-网易快三开奖结果| www.393360.com-湖南福彩新天地| www.619176.com-淄博福彩招聘| www.754448.com-北京体彩11选五| www.890865.com-手机至尊争霸彩票| www.986500.com-中国体育竞猜彩票| www.17784.com-竞彩跟单网-| www.018871.com-可以买足彩的软件| www.150478.com-2628彩票下载| www.920308.com-用手机可以买彩票吗| www.404790.com-猜冠军彩票pk10| www.72483.com-彩票用什么数学| www.112149.com-彩票3亿-| www.72944.com-中彩手彩票客户端| www.571616.com-福利彩票三等奖多少| www.082223.com-能玩天津时时彩漏洞| www.947304.com-体彩19025开奖| www.sj18.com-中国时时彩投注平台| www.387.com-r8彩票是真的吗| www.49244.com-福建十一选五爱乐彩| www.833255.com-赢赢彩app-| www.940024.com-吉林快三现金盘| www.985374.com-老时时彩下载手机版| www.06dq.com-彩铅手绘写实狗| www.082263.com-网赌时时彩害死我了| www.71708.com-精英彩票6lcc| www.128529.com-双色球杀号唯彩| www.445645.com-哪个平台能卖彩票| www.576021.com-研究福彩3d的图表| www.816406.com-买彩票中奖一夜暴富| www.990105.com-彩经彩票新版走势图| www.pg00.com-兰州体彩中心地址| www.049960.com-体彩试机号金码关注| www.470105.com-怎么购买国外彩票| www.tf06.com-体彩418走势图| www.117501.com-足彩票比分500| www.405862.com-北京七星彩内部会员| www.4275.biz-西蔵快三开奖结果| www.9580.vip-彩票网站靠谱吗| www.85lr.com-陕西体彩在哪里领奖| www.67mi.com-熊猫竞彩用不了| www.5223.xyz-温州体彩兑奖流程| www.43434.com-彩票预测公众号| www.011610.com-福彩5分钟一期的| www.516035.com-中国体彩篮球结果| www.435655.com-现在的彩票店怎么样| www.093568.com-麦久彩票网酒色财气| www.295697.com-下载彩票开奖软件| 大赢家彩票网www.178719.com| www.mc95.com-七星彩808-| www.15252.cc-时时彩遗漏分析软件| www.928528.com-福彩3d出号规律| www.893863.com-爱投彩票安卓| www.981169.com-微信拉人买彩票真假| www.aw66.com-彩迷网api-| www.857817.com-彩票能中多少钱| www.758861.com-时时彩彩票投注平台| www.568093.com-福彩3的今天彩涂|