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.571776.com-足彩app排名| www.853595.com-天津新宇彩钢板公司| www.959014.com-福彩可以转让| 彩票500万www.319075.com| www.648963.com-点击彩计划群| www.lr.com-网上快三怎么赚钱| www.33af.com-淘彩是不是诈骗| www.087388.com-3d彩吧首页-| www.299054.com-全能中彩是不是真的| 博友彩www.927633.com| www.3601.cm-南方双彩2-| www.13267.cc-竞彩误差排行| www.71527.cc-1号彩票官网| www.028249.com-手机彩票站官方网站| www.136202.com-苏州福利彩票店转让| www.663473.com-乐彩彩票是真的假的| 易盈彩票www.7793b.com| www.3085.org-福利彩票开奖日| www.27377.cc-足彩让球盘在哪买| www.001408.com-皇冠彩票平台出租网| www.081771.com-天马彩票快3| www.452429.com-大熊猫彩浜-| www.576467.com-陕西福彩中心在哪里| www.728224.com-京东彩票网官网一| www.856627.com-想开一个彩票站| www.935321.com-网络彩票不能买了| www.997488.com-那个彩票app靠谱| www.ct97.com-大发快三在线投注| www.236964.com-一分快三开奖历史| www.427712.com-福彩3d直选号软件| www.286888.com-彩票号码生成器下载| www.478903.com-怎么买彩票怎样选号| www.41zi.com-491彩票cc-| www.4501.cc-深圳侯彩彩票安全吗| www.27132.com-快中彩开奖结果| www.83509.com-吉林快三新-| www.069985.com-睿智的彩神-| 金冠彩票www.49956u.com| www.tv96.com-预知快三软件下载| www.32ss.com-七星彩巨奖-| www.5220.vip-福彩八卦库图| www.09281.com-彩票电话投注怎么买| www.64346.com-哪个足彩app好| www.2wv.cc-完美彩票官网下載| www.70mp.com-365彩票网网址| www.83bg.com-和彩印退订-| www.695583.com-福彩快三计划团队| www.945622.com-拉人玩彩票犯法吗| www.sw57.com-七星彩算法-| www.12370.com-大乐透中彩网| www.600056.cc-彩票中奖者的运气| www.703920.com-彩票狂人王成周视频| www.785231.com-七星彩和直尾振幅度| www.5530.vip-附近买彩票的| www.22715.cc-体彩排列三杀组合| www.87484.com-怎样才能戒彩票| www.7218.cm-河南福彩网七乐彩| www.38016.com-竞彩购彩大厅| www.589728.cc-网易竞彩足球比分| www.3823.cm-1183图库彩图丨| www.41868.com-中华彩吧的网站| www.067985.com-彩票摇-| www.zn36.com-快三怎么骗局揭秘| www.770605.com-彩46是正规网站吗| www.868555.com-七星彩和值尾走势图| www.952814.com-福彩开奖结结果| www.rl00.com-七乐彩9中5-| www.62vo.com-章鱼彩票就是个坑| www.798089.com-盛世彩票登录网址| www.890959.com-三态平衡分析彩票网| www.962817.com-银河彩票是正版网吗| www.cp811.com-快三有几个省开| www.219917.com-快三投注论坛| www.525887.com-啥叫私彩平台| www.06kp.com-水溶彩铅辉柏嘉| www.0503.cn-全国福彩快3| www.19821.cc-为什么玩私彩赢不了| www.66uf.com-福利彩票22选5| www.776662.cc-彩神11app-| www.883124.com-多彩投官网电话| www.964149.com-中彩票概率-| 鑫亿彩www.025079.com| www.ma94.com-下载彩票送彩金| www.w63.net-靠时时彩翻身的人| www.5461.com-开彩票店怎么盈利| www.25847.com-彩虹的寓意和象征| 梦想彩票www.33112f.com| www.tc91.com-沉迷彩票的下场| www.11wz.com-大发快三计算技巧| www.80xc.com-财富彩票平台网址| www.1963.top-台北快三开奖号码| www.8938.cc-新世界彩票计划软件| www.34743.com-乐彩购商城兑换积分| www.378614.com-足彩走势图-| www.55976.cc-快三出啥买啥| www.053728.com-胜负彩怎么玩| www.078559.com-安徽阜阳体彩中心| www.414418.com-出彩人生的含义| www.880811.com-淘宝买彩票合法吗| www.044163.com-快三2码遗漏| www.555856.com-快乐5分彩-| www.8ai.cc-好彩平台注册| www.391921.com-a7彩票娱乐下载| www.70923.com-三度彩金论坛| www.260115.com-为什么彩票不算赌博| www.511876.com-彩票投注站转让上海| www.739893.com-鑫源彩票网-| www.657686.com-体育彩几点开奖| www.822818.com-体彩时时彩种类| www.954943.com-辽宁福彩双色球官网| www.ni52.com-大发快三总平台计划| www.90350.com-77彩票网站-| www.128748.com-go彩砍龙团队| www.022834.com-福彩334断组公式| www.138630.com-鸿彩是真是假| www.220255.com-时时彩定胆公式| www.285172.com-826彩票平台| www.356633.com-酷彩吧客服-| www.456446.com-红彩影视app| www.580923.com-天空彩牛网-| www.651195.com-名家水彩花卉| www.703257.com-福彩3d中奖奖励| www.893181.com-超级彩票助手苹果版| www.b13.space-七星彩七开奖结果| www.55wb.com-体育彩票十一运夺金| www.0224.com-淼鑫彩票网-| www.4983.cn-顶呱刮彩票兑奖| www.21958.cc-百度彩票365下载| www.77448.cc-豪博5k彩票-| www.114775.com-旺旺彩下载-| www.205671.com-一定牛彩票软件| www.773848.com-王雷中谈国外竞彩| www.420036.com-新体彩票首页| www.556477.com-彩票491cc-| www.645027.com-35彩票网页版| www.696954.com-竞彩足球的开奖结果| www.n66.top-如何能买彩票中奖| www.60tp.com-福彩3d大花猫彩报| www.885500.com-金利彩票可靠吗| www.986336.com-金手指的彩票专栏| www.to.com-彩票吧-| www.qn41.com-快三外挂软件下载| www.4yc.cc-福彩3d组三价格| www.47ij.com-分分彩奖金制度| www.166.la-神舟彩登录-| www.2620.cc-七零彩票-| www.7021.org-竞彩篮球大小分结果| www.268578.com-福彩3d字谜总汇一| www.590722.com-澳门幸运彩是真的吗| www.659269.com-彩之星官网-| www.92534.com-立彩倍投计划| www.106664.com-彩票杀码什么意思| www.546553.com-福利彩票申请书样本| www.034971.com-799彩票-| www.133389.com-围挡彩钢围挡价格| www.252413.com-全民彩票官网网页版| www.322548.com-来自旺彩大乐透社区| www.387124.com-七彩球开奖结果| www.192118.com-河北快三今天走势| www.253098.com-甘肃好彩快三查询| www.312128.com-福建福彩快讯电子报| www.367307.com-彩铅画雏菊图片| www.476060.com-北京北控体彩| www.536127.com-彩票数字有34嘛|