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天

知道了
彩票256平台 www.548802.com-体彩推荐app| www.89233.cc-6000万彩票平台| www.766748.com-网站彩票代理加盟| www.456973.com-特吧彩-| www.582090.com-维彩看球下载| www.b86.com-168时时彩-| www.30794.com-彩票66网是不是| www.028477.com-快三大小单双的规律| www.cp6738.com-广西快三派彩走势图| www.574035.com-世纪星彩票-| www.699093.com-福彩主任唐启伟简介| www.04hm.com-内蒙古体彩网点查询| www.771.space-时时彩开奖早知道| www.806280.com-彩票倍投是否合理| www.923562.com-彩票开彩票软件| www.986909.com-快三倍投怎么投| www.rn2.cc-最新彩民乐-| www.vd35.com-智慧彩票网-| www.18nj.com-今晚有什么彩票开奖| www.922924.com-网络竞彩平台靠谱吗| www.ga70.com-彩票选好选几个| www.70320.com-f8彩票-| www.039258.com-海南体彩手机购彩| www.633807.com-彩友汇是正规平台吗| www.748339.com-红彩票app-| www.4575.wang-快赢彩票app| www.6789.net-77彩票手机版77| www.15gt.com-易彩乐全国玩法| www.cp108.com-快三怎样看走势图| www.80ns.com-和彩500-| www.523812.com-人人中彩票在线客服| www.829716.com-连中彩票官方网站| www.897276.com-国外彩票最高巨奖| www.961645.com-唐三彩蓝釉拍卖价格| 大赢家彩票平台www.810730.com| www.re29.com-五分时时彩走势图| www.36.cx-彩票心理学-| www.74la.com-福利彩票大全走势图| www.1430.cn-海南四字彩票| www.7116.top-彩128-| www.928260.com-福彩平台充值36元| www.936592.com-彩客竞彩彩票好用吗| www.hs62.com-北单彩票-| www.40zg.com-彩票清明放假通知| www.881590.com-19017期体彩| www.cm57.com-贵州快3彩经网| www.2560.me-彩票真实灵异故事| www.70.cc-滴滴彩-| www.74fp.com-彩票刷流水单违法吗| www.313621.com-好彩3缩水技巧| www.389090.com-澳客竞彩网手机版| www.521241.com-七星彩中奖查询表| www.003563.com-彩之源注册-| www.165640.com-168彩票老版本| www.451955.com-附近体彩彩票站| www.233482.com-大发快三属于赌博吗| www.39982.com-3号彩票苹果版| www.988123.cc-百万彩票是不是真的| www.sm69.com-助赢时时彩计划免费| www.73ae.com-松原800米彩票站| www.4721.biz-248彩票网黑钱吗| www.779548.com-福利彩票最新政策| www.855447.com-七星彩奖金怎么计算| www.926319.com-众彩网官方下载| www.982715.com-彩票体验金-| www.fm9.com-体彩7星彩玩法| www.qm77.com-太全彩票-| www.9ff.com-体彩大乐透公式计算| www.67nf.com-盼望竞彩app| www.cp7499.com-广西快三开奖直播| www.507262.com-至尊争霸彩票合法吗| www.668437.com-88彩票专家-| www.751436.com-福彩怎么买法| www.853023.com-cb彩宝彩票安全吗| www.913102.com-彩票在哪个app买| www.968495.com-福彩流水单是真的吗| 天下彩www.508680.com| www.52979.com-时时彩要停吗| www.576312.com-快三缩水工具超强版| www.673397.com-爱乐彩快三下载| www.751138.cc-佰万彩票破解| www.814343.com-福彩国际可靠么| www.52673.cc-188彩票网-| www.167.org-手机话费怎么买彩票| 天天彩票www.1035r.com| www.637816.com-668彩网-| www.5355.top-为什么网上不卖彩票| www.cai5277.com吉林快三质合走势图| www.2869.cc-帮我查一下福利彩票| www.07635.com-贵港彩票下载| www.795068.com-下载一个如意彩票| www.871967.com-美国彩票多少钱一注| www.947001.com-靠彩票发财可能吗| www.992629.com-喜乐彩票网-| www.bo67.com-香港天下彩网网址| www.uo60.com-澳门快三导师| www.08zu.com-广西新粤彩-| www.78sw.com-福彩3d黄金胆码| www.fd9.com-老时时彩五星走势| 易彩网www.12455t.com| www.kd88.com-福彩双色球球选号器| www.110649.com-福彩20分钟开奖| www.862614.com-七乐彩振幅走势图| www.926757.com-达人彩票靠谱吗| www.987759.com-505彩票本着| www.rz.cc-七天彩票官网| www.580794.com-胜负彩怎么算中奖| www.726523.com-美术彩铅画作品图片| www.937798.com-怎样注册易彩娱乐| www.lg91.com-中彩彩票怎么赚钱| www.056112.com-彩票7位数中5位| www.207129.com-至尊快三-| www.296411.com-体育彩票往期开奖| www.680753.com-银川体育彩票网点| www.761731.com-手机上能买福彩吗| www.830575.com-合乐彩app注册| www.887288.com-乐宝彩票的骗局| www.952472.com-17彩票软件安全吗| www.993681.com-开什么彩票店最赚钱| www.kh6.cc-现在快三平台那么多| www.ml18.com-时时彩注册送10元| www.730578.com-海南福彩快2玩法| www.802812.com-198彩平台-| www.900007.com-彩票号码随机生成器| 大赢家彩票平台www.186753.com| www.9785.me-体彩千禧试机号查询| www.363835.com-彩虹漫画男-| www.470794.com-斯洛伐克彩开奖网站| www.563214.com-优优反波彩平台| www.630426.com-好彩爆珠台版| www.692821.com-体彩图库-| www.761402.com-搜神传之我是蓟彩芝| www.834667.com-高清炫彩手机壁纸| www.888218.cc-诸葛智彩电脑版| www.948812.com-好运快三正规吗| www.986661.com-中国福利彩票快乐3| www.cp3538.com-湖北快三推荐号| www.770552.com-豫彩通app官网| www.0104.top-天天彩票开奖结果| www.356.tv-国外高频彩票| www.17142.com-下载山东省福彩| www.33cg.com-排3字谜预测凤彩网| www.403865.com-彩神挣霸2-| www.511706.com-迷恋彩票-| 500彩票www.50074f.com| www.59373.cc-爱彩票登录不了| www.019114.com-彩票资讯双色球预测| www.077169.com-青海福彩官网| www.126120.com-手机卖彩票合法的吗| www.181163.com-宁夏快三开奖在哪看| www.255031.com-时时彩下载手机版| www.07td.com-6加1彩票要顺序吗| www.871623.com-超级彩票助手安卓版| www.337778.com-呼市福彩中心魏主任| www.631763.com-好彩2什么意思| www.685013.com-福彩3d牛彩网彩摘| www.797221.com-官方凤凰彩票网站| www.ih45.com-微信广东福彩公众号| www.021132.com-老谢说彩专家栏| www.997540.com-968彩票官网| www.550370.com-休闲快三拉花| www.872418.com-快三组合对应码打码| www.985234.com-竞彩2c1保本对冲| www.yb72.com-去彩票站怎么买彩票|