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.9669.cn-香港生肖彩论坛| www.7468.org-如何申请体育彩票站| www.9623.xyz-排三免费预测彩经网| www.z60.top-宋金时期红绿彩小人| www.ja79.com-竞彩足球比分彩客网| www.734518.com-喜鹊彩票历史数据| www.701915.com-广西体彩网官网| www.257620.com-六开彩开奖结果| www.813295.com-腾讯彩票游戏正规嘛| www.275206.com-彩种多的彩票平台| www.543550.com-明代釉下五彩瓷| www.709436.com-今天体彩大乐透领奖| www.924169.com-4亿彩-| www.7pw.com-竞彩彩民平局心得| www.3686.in-乐彩vip大发快| www.596808.com-福彩双色球5等奖| www.682607.com-中国福利彩票自助机| www.771781.com-时时彩官方开奖平台| www.nf97.com-华厦彩票-| www.12qh.com-体彩排五奖号| www.511665.com-合肥福彩中奖| www.735881.com-彩票分析师app| www.838417.com-互动彩票江苏快3| www.916208.com-私彩什么平台靠谱| www.979350.com-246好彩-| www.ak22.com-七星彩下期预测号码| www.k99.cc-大奖彩票网址是哪一| www.50bm.com-篮球竞彩胜负稳赢| www.1442.xyz-109彩票安卓版| www.683678.com-体彩夸走势图| www.879064.com-和彩印怎么设置| www.159065.com-福利彩票机选摇一摇| www.772233.com-中国福利彩票图标| www.954694.com-彩77安卓规矩| www.cp3177.com-福建快三预测一定牛| www.ug57.com-彩乐乐幸运选号| www.582239.com-彩客网页-| www.683250.com-彩票押50万-| www.776753.com-好球彩票app| www.858852.com-山东福彩双色球开奖| www.927116.com-彩票网快3-| www.979991.com-体彩店多少钱| www.cp2839.com-贵州快三结果走势图| www.921826.com-一起博彩票平台| www.988981.com-中福彩票线上投注| www.dz14.com-广西快乐彩开奖结果| www.xt79.com-打彩票运气-| www.19mb.com-想中彩票有什么技巧| www.997657.com-唐龙说彩今日3d| www.xg15.com-亚洲彩票稳定吗| www.40nk.com-好彩票专业版苹果| www.6668.me-华夏彩票苹果版| www.96209.com-福彩高官内部揭露| www.062406.com-全球彩霸高手论坛| www.146484.com-256时时彩下载| www.451338.com-菲律宾游彩网| www.40gy.com-七星彩奇偶取法| www.1478.com-精彩中国-| www.898459.com-篮球彩票什么软件好| www.sa38.com-各国彩票-| www.9382.org-那种彩票容易赚钱| www.45054.com-九九彩票是黑彩吗| www.323619.com-新加坡天天彩资讯绷| www.428368.com-足彩105-| www.520826.com-7星彩几点开奖时间| www.590695.com-新彩网排列五预测| www.208515.com-体彩竟彩-| www.502125.com-河南的彩礼很高吗| www.576359.com-腾讯时时彩稳定计划| www.655619.com-五福彩新版下载安装| www.720822.com-彩票平台软件下载| www.801012.com-皇都彩票安全吗| www.873455.com-体彩限量销售| www.946234.com-福建体彩app下载| 购彩堂www.665478.com| www.588567.com-春节后何时七星彩开| www.876458.com-基诺彩票怎么买| www.973035.com-彩虹世界官网网址| www.ui5.cc-百宝彩票下载| www.k42.com-彩神争大发快三| www.966765.com-宝马彩票彩平台| www.cai5507.com快三计划软件下载| www.898814.com-懂球帝足球彩票软件| www.977923.com-快三能赚钱-| www.ab48.cc-腾讯十分彩开奖号码| www.ts35.com-合买彩票是哪个软件| www.42rt.com-苹果6sp原彩显示| www.668.in-时时彩对打刷流水| www.646937.com-网易十四场足彩预测| www.763776.com-华宇博彩-| www.918136.com-福利彩票代理怎么开| 众乐彩票www.235644.com| www.261491.com-彩票送38彩金大全| www.381543.com-泰安市福利彩票中心| www.535007.com-电玩城彩票机怎么玩| www.593391.com-多彩投烂项目| www.029955.com-福彩刮刮乐在线兑奖| www.128050.com-关于彩虹的图片大全| www.981835.com-头奖彩票新闻| www.gi6.com-福利彩票所有彩种| www.xj22.cc-三分时时彩技巧集锦| www.36hy.com-七星彩长居-| www.96ql.com-彩票平台首充送彩| www.2669.biz-陶彩票合法吗| www.7652.loan-正彩彩票下载安装| www.20203.cc-彩神通三码-| www.71382.com-上海彩票自助| www.58ii.com-605彩票下载| www.8745.net-彩票预测插件| www.54587.com-白菜彩金手机验证| www.97133.com-足彩推单软件| www.390642.com-体彩11选5彩票| www.881556.com-天齐彩票论坛| www.977451.com-濮阳市彩礼文件| www.ls35.com-全民彩-| www.305298.com-七星彩18104期| www.381378.com-买彩票如何选号| www.608569.com-体彩彩票开奖查询| www.87pr.com-淘宝彩票怎么没了| www.327583.com-下载彩票开奖| www.418701.com-好彩香烟铁盒包装| www.539473.com-彩票店如何扩展客户| www.715379.com-彩票微博-| www.89zh.com-什么牌子的彩漂好用| www.4587.biz-教育双龙彩票| www.483812.com-花生彩票网站| www.070085.com-彩神在线-| www.160930.com-福彩品种-| www.87zo.com-新版跑狗图4s彩票| www.2738.in-怎么下载快三游戏| www.8588.me-彩票点中大奖| www.731028.com-19043胜负彩| www.26064.com-彩虹有什么象征意义| www.823625.com-彩涂印花板-| www.904087.com-博乐彩票-| www.954843.com-给瑞彩祥云网站| www.991981.com-福利彩票复式投注表| www.cp06.com-江苏快三预测软件| www.448253.com-彩票工具网(最新)| www.969719.com-台湾今彩-| 博友彩www.876312.com| www.551427.com-新浪足彩佬牛| www.819768.com-彩票对于社会的利弊| www.877700.com-国内购买美国彩票| www.929651.com-七星彩出多少号| www.971253.com-彩票c16-| www.cp0506.com-极速快三破解软件| www.jf68.com-彩派电子走势图免费| www.xd37.com-快三走势图北京的| www.21jy.com-彩票软件数据库| www.076770.com-南京福利彩票中心| www.639504.com-苏宁竞彩-| www.981612.com-创富彩票可靠吗| www.fe20.com-大发快三网址大全| www.e62.cn-体彩nba赔率| www.964830.com-浙冮体彩-| 吉利彩票www.66376p.com| www.01321.com-8彩店-| www.86575.cc-彩吧论坛迷语图库| www.ts77.com-彩之家v2.3.1| www.76we.com-福彩自助终端机功能| www.397839.com-足彩比分直播预测| www.545936.com-怎么样申请彩票站| www.vv58.com-中信彩票计划靠谱吗|