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天

知道了
彩39彩票安卓 www.272512.com-江苏快三走势图批| www.337358.com-广西福利彩票网| www.609817.com-世爵彩票直属账户| www.791465.com-京东计划彩-| www.895696.com-永诚彩票网官方网址| www.980000.cc-送彩票活动案例| www.bd76.com-快三单双大小规律| www.xs54.com-没钱也敢买彩票| www.365107.cc-风之彩app-| www.10ld.com-进球彩最新开奖结果| www.243293.com-彩票几天兑奖期限| www.362830.com-雨后的彩虹-| 中国福利彩票www.3478p.cc| www.cai7033.com百宝彩快三-| www.385034.com-七星彩专家汇总预测| www.wc2.cc-彩经网排列3免费| www.vb01.com-体育彩票开奖视频| www.659724.com-彩票万能手机软件| www.a75.cc-体彩排列五笫快讯| www.443880.com-色彩的三原色是指| www.34co.com-彩票网制作-| www.1840.tv-cpb彩票榜-| www.40140.com-彩票网上兑奖| www.100776.com-全民彩票旧版app| www.6997.pw-云南七彩捞腌菜| www.203679.com-体彩基诺-| www.55ii.cc-金利彩票手机版下载| www.43if.com-河南彩涂铝卷生产| www.527087.com-时时彩对子-| www.651328.com-水彩手绘-| www.970553.com-燕赵福彩排列7| www.694916.com-排三预测总汇众彩网| www.811556.com-优的足球彩票| www.888471.com-彩票137下载| www.979407.com-中免好彩多少钱一包| www.lr.cc-足球竞彩网-| www.pz84.com-333彩票下载| www.2xs.cc-吉祥彩票贴吧| www.140364.com-七星彩购彩大厅| www.251225.com-彩票巴士平台| www.07aw.com-彩铅星空狼画法| www.016388.com-如何看懂彩票k线图| www.982487.com-竞彩实体店开售时间| www.vm9.com-马来西亚有什么彩票| www.07gj.com-雏菊彩铅画浅紫| www.93ih.com-九亿彩票注册下载| www.129511.com-众盈彩-| www.90cg.com-篮球博彩看盘| www.46bm.com-体彩排列百度贴吧| www.1035.com-速彩网app下载| www.7223.wang-彩虹六号大盾原型| www.19775.com-内蒙快三兑奖图| www.983068.com-体彩吧台-| www.kq88.cc-凤彩网网址-| www.981246.com-彩霸王三星做号软件| www.he29.com-百宝世嘉彩票走势图| www.738409.com-体彩五d历史开奖| www.56sz.com-彩票免费加盟代理| www.2611.com-福彩快三算法| www.8300.xyz-手机高手彩票网| www.46992.com-彩票源码要去哪里买| www.8803.top-竞彩触屏版-| www.372117.com-2044彩票开奖| www.066384.com-567彩票下载苹果| www.001888.com-林兴洛福彩3d| www.332830.com-怎样买彩票会中大奖| www.531811.com-篮彩nba比赛| www.5819.cn-竞彩胜平负怎么玩| www.08nf.com-933彩票娱乐平台| www.752710.com-网络彩票推广技巧| www.397034.com-神圣彩票骗人吗| www.518772.com-51亿彩票诞生| www.587051.com-彩票有哪些软件| www.665034.com-彩票刷水是什么意思| www.753512.com-彩票守号十二年| www.828543.com-英国彩票大奖| www.898657.com-福彩三d预测号总汇| www.976846.com-2018德州彩礼钱| www.cai9311.com七星彩最准专家预测| www.ls01.cc-彩66app-| www.62mz.com-篮彩推荐网-| www.530885.com-马可彩铅-| www.791458.com-千禧彩票官网| www.868877.com-福利彩票摇奖用球| www.931557.com-辽宁福彩电话投注| www.982343.com-四川体彩七星彩查询| www.cp1106.com-北京快三计划网页版| www.kt50.com-彩票神争霸8下载| www.zq24.com-3d彩票开奖号今天| www.20vj.com-怎样选彩票号码| www.079664.com-彩虹刷业务平台| www.568460.com-彩票实体店铺二维码| www.456000.cc-百彩宝电子走势图| www.549751.com-彩播直播平台| www.613779.com-体彩11选5分地区| www.675.red-重庆体彩电话| www.606515.com-彩票怎么暂停销售了| www.890915.com-qq7彩票下载安装| www.715126.com-彩神争霸88czj| www.915774.com-彩票站和超市一起开| 彩票5www.648148.com| www.1738.com-开心七星彩图版区| www.601206.com-9h555彩票-| www.693017.com-体彩大乐透透走势图| www.764404.com-幸运彩票注册送彩金| www.771937.com-永盛时时彩二维码| www.860765.com-内蒙快三推荐号| www.925729.com-彩富网免费资料天下| www.980025.com-中国体育彩票装修| www.17nl.cc-彩票机私接销售系统| www.232768.com-新浪足彩比分| www.9841.cc-南京体彩销售点转让| www.46420.com-乐透型彩票中奖技巧| www.87865.com-微信金沙博彩骗局| www.906131.com-怎么建立彩票网站| www.160990.com-神州七彩平台| www.188394.com-安徽快三规则| www.665321.com-保定福彩中心地址| www.184496.com-彩票快三秘诀| www.808272.com-天天开奖的彩票| www.970784.com-数学天才破解彩票| www.tu03.com-彩票合买平台软件| www.691151.com-87彩票店铺邀请码| www.753290.com-九州彩票手机app| www.815518.com-福彩双色球1倍中奖| www.874303.com-亿彩彩票时时分分彩| www.928735.com-旺财彩票代理| www.973635.com-快三能回本吗| 财神网Ⅱwww.377939.com| www.865962.com-彩票开奖大全安装包| www.60073.com-福体彩开奖直播间| www.4839.cc-9号彩票注册网址| www.703078.com-足球彩票兑奖计算器| www.908616.com-彩票七星彩预测号码| www.42vz.com-彩票代理计划员招收| www.110513.com-旺彩彩票能网络购彩| www.523997.com-北欧十分彩开奖结果| www.44137.cc-特彩吧网-| www.940764.com-360彩票杀号定胆| 818合彩www.www.5666hc.com| www.317070.com-体彩中奖得主吗| www.948696.com-高频彩票资金分配| www.mv6.com-怎样看彩票的走势图| www.220337.com-乐彩网app-| www.577867.com-香港hk百彩网| www.pv65.com-大资本彩票骗局揭秘| www.0su.com-彩客彩票4.7版本| www.89603.com-好彩蓝莓爆-| www.141238.com-鸿运彩票手机网| www.923099.com-709彩票旧版本| www.986634.com-本期足彩310预测| www.cp5119.com-新快三玩法-| www.025640.com-一定牛遗漏快三安徽| www.37758.com-菲律宾一分彩| www.084148.com-彩票群里面有托么| www.j51.me-118彩票下载安装| www.71mp.com-众购彩票网免费注册| www.0305.org-如何选碗釉中彩| www.783353.com-体彩七星彩开奖日期| www.341354.com-怎样拉人玩彩票| www.222881.com-分分快三规律| www.032372.com-五福彩票821cc| www.391955.com-天禧彩票官方直营| www.175926.com-快三稳赚技巧|