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.592880.com-彩虹7号围攻| www.815989.com-排五走势图乐彩网| www.2255.hk-彩票赛车软件| www.33603.com-老杨说彩双色球预测| www.084578.com-ios玩彩票的软件| www.311986.com-红旗彩票快3| www.210810.com-中华彩票信誉老品牌| www.332211.com-10选五是啥彩票| www.508100.com-和福彩合作的企业| www.571579.com-87彩店手机客户端| www.cp8995.com-甘肃福彩快三走势图| www.53on.com-福利彩票彩票赚钱吗| www.6200.wang-cp彩票苹果版下载| www.39399.com-全民中彩提款| www.gd53.com-花田彩票托-| www.8397.pw-福彩各类和值谜| www.310505.com-湖南体彩网论坛| www.0910.vip-彩票为啥难中奖| www.536030.com-福彩p62组选| www.686298.com-万博app怎么竞彩| www.484840.com-彩量科技-| www.348408.com-福彩奖金到账| www.495329.com-电竞博彩业-| www.577939.com-精彩视频点观看| www.681151.com-网络彩票该怎么戒掉| www.790515.com-彩票随号软件| www.934580.com-掌上娱乐彩票苹果版| 购彩在线www.66332p.com| www.107002.com-博大彩票是真的吗| www.9338.in-吉祥彩开户线路| www.070440.com-彩票365苹果版| www.59801.com-玩彩教你怎么稳赚| www.061042.com-彩票店新模式| www.681150.com-豪彩娱乐网址下载| www.767773.com-旺彩彩票开奖| www.897655.com-快易彩app下载| www.958046.com-3d福彩网上购买| www.cai1117.com快三玩法规则及奖金| www.py06.com-福彩快三速查表图| www.3535.in-登录福彩诈骗| www.999035.com-五分快三概率| www.ji31.com-发彩网靠谱吗| www.pz46.com-九彩彩票app| www.03uz.com-香港彩票报刊大全| www.954012.com-体育彩票软件可靠吗| 500彩票www.330275.com| www.254535.com-好彩投app官网| www.956512.com-新未来彩票平台| www.ci38.com-吉林快三太赖| www.50494.com-最高手七星彩解诗网| www.020156.com-购彩帮助中心| www.092978.com-彩钢工地围挡图片| www.715127.com-88神彩-| www.877335.com-七乐彩杀号公式| 彩多多www.78949j.com| www.569402.com-湖北快三两码遗漏表| www.669531.com-数学预测彩票| www.746109.com-天天手游彩票计划| www.811337.com-五分钟快彩-| www.2722.cn-旺彩双色球是真的吗| www.40795.com-彩票九官方-| www.071872.com-福彩3d中心开机号| www.10557.com-湖北快三高频彩票网| www.009868.com-福利彩票图片| www.70ee.com-红菜苔彩票规则| www.470653.com-竞彩就是赌博| www.578886.com-盈众彩票幸福常伴| www.661463.com-日本年末彩票开奖| www.730991.com-时彩代理怎么做| www.795186.com-福彩3d好运彩| www.863152.com-分分彩任二挂机玩法| www.920694.com-青海快三遗漏| www.972661.com-彩铅q版萌图| www.cp6161.com-山东彩票沙龙论坛| www.sb94.com-快三限号规则| www.36xf.com-竞彩足球计算机器| www.7617.top-1216彩票平台| www.38358.com-海南七星彩打奖软件| www.11358.com-江苏快三开奖新浪| www.96658.cc-私彩破案追回| www.467246.com-彩票对家庭害处| www.561160.com-彩王008-| www.657924.com-微信新世界彩票| www.832499.com-下载七彩视频| www.017701.com-cp彩票下载安装| www.127940.com-彩虹合唱歌词| www.177300.com-彩票都有哪些快三| www.269561.com-7彩票app-| www.642968.com-900天福彩票| www.724013.com-福建体彩时时彩开奖| www.000.cx-彩神8是真是假| www.5958.me-福彩31期-| www.16891.com-横彩网网站-| www.72819.com-吉林省中国福彩3d| www.037654.com-彩票大師-| www.66332.cc-华阳彩票真实性| www.025785.com-彩票什么叫跨度| www.098390.com-彩票网有哪些| www.56463.com-欢乐彩票进入网址| www.41th.com-快三大小单双预测| www.137684.com-体彩胆码预测家彩网| www.644999.com-今日开奖彩宝网| www.36ih.com-七星彩开机号试机号| www.0422.vip-418彩票下载| www.6337.org-顺亿彩票是真的假的| www.28049.com-xy1688彩票-| www.63792.cc-竞彩必发交易| www.017204.com-152彩票邀请码| www.083609.com-彩票指南报体彩| www.6112.pw-网上美国彩票怎么买| www.25871.com-见到彩虹寓意| www.66312.cc-排3试机号乐彩网| www.035958.com-彩天下坑人真相| www.505147.com-福利彩与体彩| www.232903.com-好彩堂开奖结果现场| www.729304.com-有多少人彩票中奖| www.073399.com-1彩注册-| www.028477.com-快三大小单双的规律| www.31rv.com-3月19号福利彩票| www.170362.com-吉林快三走势详细图| www.62zv.com-中国体育彩票号码| www.42816.com-免费送彩金官方网站| www.85922.cc-58福彩官网-| www.b60.in-假彩票机-| www.271295.com-晚晚好彩-| www.635263.com-七彩假期评选方案| www.770268.com-好彩香烟60万图片| www.832525.com-纯七彩图片大全| www.906730.com-福彩有哪些彩票开奖| www.966383.com-快三倍投方式| www.cai1088.com江苏快三是骗局吗| www.jg67.com-网上赌彩票犯法吗| www.35958.com-中国福利快乐彩05| www.134131.com-好彩纯烟-| www.541415.com-火箭彩网站-| www.956335.com-福利彩票三d开奖号| 鑫亿彩www.196902.com| www.512953.com-彩票直通车预测| www.286718.com-彩票挂-| www.366304.com-黑圣手字谜搜彩网| www.456555.cc-彩票全天计划记录表| www.074234.com-旭彩网平台-| www.163420.com-巨彩网是合法的吗| www.256900.com-安徽快三预测大小| www.622365.cc-香港星彩网网址| www.439217.com-大乐透中大奖彩票图| www.976656.com-西平县结婚彩礼多少| www.er78.com-彩运8怎么看趋势| www.j61.club-七乐彩综合号码预测| www.30yz.com-彩虹岛梦境攻略| www.900125.com-22彩票软件-| www.974594.com-排列3预测众彩网| 全民彩票www.971291.com| www.266670.com-河北快三奖金表| www.611865.com-m5彩票是骗局吗| www.721295.com-幸运8五分彩规律| www.807141.com-彩神时时彩全能王| www.908369.com-彩票最新源码| www.995630.com-彩678坑人吗| www.mb22.cc-快三作弊器-| www.247868.com-彩票快三群注册| www.271882.com-立彩平台app| www.355104.com-如何看体彩是否中奖| www.393292.com-湖南省福彩官网|