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.576389.com-足球彩票系统升级| www.611780.com-新昌双彩茶苗黄茶| www.884971.com-河北爱彩乐十一选五| www.37ug.com-国家原体彩中心主任| www.853808.com-下载pp彩-| www.3095.cn-一号彩dt-| www.38744.com-福彩3d绘图-| www.140238.com-幸运一分时时彩| www.990083.com-3分快三官网开奖| www.212021.com-8彩客站-| www.355511.com-福彩3d专家杀码村| www.480003.com-体彩网吧-| www.633786.com-彩乐汇是什么平台| www.800830.com-福彩3d天天开奖吗| www.905638.com-彩神霸百姓彩票| www.986667.com-唯一正规彩票网站| www.ea93.com-玩吉林快三的app| www.144711.com-彩票2元网首页官网| www.313782.com-彩票分析与-| www.426668.cc-今日体彩p3藏机图| www.276326.com-七乐彩10中5| www.bn8.cc-下载广西快三助手| www.47sk.com-本站彩票-| www.109049.com-彩票网上模拟选号器| www.291777.com-鸿彩网app-| www.493047.com-如何举报黑彩票| www.674535.cc-今天3d彩票-| www.cy39.com-仿造彩票打印软件| www.65tf.com-多摩豪全彩漫画大全| www.4820.cm-老版下载即时开彩| www.71453.com-众盈彩票安卓版下载| www.cai8156.com湖北福利彩票走势图| www.563743.com-长春八角星体彩网| www.882458.com-英国五分彩靠谱吗| www.au90.cc-内蒙古福彩快3走图| www.122363.com-七是彩走势图| www.345676.com-彩之王我的账户| www.583666.com-体彩兑奖到哪个银行| www.725377.com-颜彩-| www.901597.com-体彩排列五中一个号| www.cai9755.com贵州快三开奖公告| www.151130.cc-49彩票平台登陆| www.853522.com-海口体彩中心地址| www.984970.com-彩运8pk拾走势图| www.sj97.com-重庆时时彩不开奖了| www.80tm.com-财富彩票正规么| www.26993.com-2元彩票app下载| www.720580.com-七乐彩生肖幸运选号| www.886073.com-中国五洲彩票c0m| www.0962.pw-四场进球彩投注| www.980077.cc-体彩店装修风格| www.nl11.com-足彩19046-| www.136778.com-火箭彩票app版| www.383837.com-足彩怎么玩才能挣钱| www.739349.com-中国竞彩网网点| www.990920.com-彩票12选5辽宁| www.n81.net-体育彩票基础知识| www.850297.com-竞彩5串5-| www.975608.com-505彩票软件下载| www.95724.com-民政局福彩中心上班| www.2028.net-彩虹六号进游戏蓝屏| www.133250.com-富彩彩票吧-| www.362806.com-彩虹花变化极多| www.594971.com-好彩赢三张官方下载| www.2375.win-福利彩票呼市福彩| www.024244.com-福彩3d大奖故事| www.223872.com-体彩6十1开奖结果| www.085740.com-彩票反水什么意思| www.17hp.com-福彩书籍大全| www.005191.com-体彩浙江6十1玩法| www.301252.com-亿彩彩票app下载| www.744916.com-彩票管理条例实施| www.3508.cm-彩票维护到什么时候| www.83356.com-彩票统计分析方法| www.834667.com-高清炫彩手机壁纸| www.91ta.com-专业彩票走势图首页| www.42680.com-彩神计划帐号免费| www.409119.com-澳洲3分彩投注技巧| www.794805.com-彩开头的成语| 手机购彩www.sjgc9.com| www.576936.com-兰州彩民中奖| www.874679.com-体育博彩高返水网站| www.py53.com-581彩票网-| www.028248.com-鸿彩led投光灯| www.518022.cc-成都乐迷炫彩安全吗| www.966671.com-彩票手机机选下载| www.2656.pw-时时彩万位杀号| www.98596.cc-腾讯分分彩中三技巧| www.589010.com-南国七星彩高手交流| www.309557.com-一等奖中奖彩票图片| www.388913.com-福彩3d微信群讨论| www.520761.com-腾讯分分彩杀1码| www.597523.com-实用的彩票app| www.668909.com-彩吧神字图库第五版| www.745636.com-c彩61彩票官网| www.808696.com-中国彩票吧网站| www.876505.com-天下彩票之开奖结果| www.06tu.com-彩铅星空画法教程| www.64jl.com-众彩网是什么东西| www.1398.top-双色球彩池奖金| www.7145.org-七彩狐泳衣-| www.12193.com-体彩双色球开奖结果| www.52062.com-广东褔彩快乐十分| www.3977.cc-nba竞猜彩票| www.05087.com-国家允许的网上彩票| www.110730.com-650彩票-| www.176547.com-福彩快三技巧心得| www.139898.com-上海体育彩票怎么开| www.001721.com-那种彩票中奖率高| www.063554.com-体彩怎么加盟费多少| www.137664.com-贵宾中彩网址是多少| www.198921.com-山西福彩快乐10分| www.299627.com-彩票二元-| www.397206.com-乐透彩票怎么下载| www.485958.com-幸运彩票计划聊天室| www.9870.in-全国体育彩票试机号| www.74440.com-晴彩山西频道春晚| www.577616.com-彩虹糖颜色味道| www.652820.com-49彩票登录-| www.778431.com-宁波体彩一等奖兑奖| www.915280.com-福彩3b天齐网字谜| www.995875.com-80彩票合法吗| www.18ar.com-反赌吉林快三| www.0410.xyz-排列三缩水彩吧工具| www.43198.cc-中彩网不能出款| www.83822.cc-彩票刮刮乐游戏机| www.048477.com-3d水果图彩吧胆码| www.134853.com-好彩烟红色多少钱| www.206090.com-彩票兼职骗局| www.172250.com-多乐彩开奖查询江西| www.032458.com-福彩网彩票代理| www.165211.com-掌中彩可以提现吗| www.253666.com-北京福彩官网打不开| www.358682.com-临朐北京花园中彩票| www.518284.com-下载安徽体彩| www.616087.com-百万彩友高手| www.736821.com-上海福彩手机投注| www.813894.com-腾讯出过彩票游戏吗| www.892367.com-九州彩票下载安装| www.108831.com-福彩预测专家最准确| www.366574.com-彩铅叠色技巧图片| www.501070.com-黑白照怎么变彩色| www.603372.com-好友彩票登录网址| www.706036.com-彩票如何兑奖| www.16pd.com-k菜彩民福地| www.007.host-通宝博彩地址| www.4583.xyz-彩票自选号码| www.74984.com-体彩有几种-| www.069658.com-数字专家破解博彩| www.226228.com-下彩网是正规的吗| www.340366.com-彩天堂娱乐赚钱吗| www.444591.com-黑彩3dqq群-| www.557770.com-66彩票-| www.624848.com-苏宁彩票啊苏宁旗下| www.22116.cc-竞猜足彩分析预测| www.211695.cc-快开型彩票的弊端| www.322999.com-三分彩历史开奖记录| www.437622.com-竟彩胜平负开奖| www.555420.com-高频彩票被停| www.08jb.com-体彩开机号码| www.79ox.com-福利彩票教学| www.7570.org-海南7星彩软件| www.892025.com-浙江快乐彩玩法| www.37ay.com-类似七星彩小说|