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天

知道了
亚洲28 www.050916.com-快三单注奖金多少| www.256560.com-官方彩票平台有哪些| www.357107.com-彩票归属权-| www.539767.com-搜狗彩票平台| www.677467.com-爱投彩票是真的吗| www.793658.com-正规彩票注册| www.910111.cc-天空彩高手抢坛| www.994834.com-01彩票兼职-| www.ap09.com-福彩精华布衣天下2| www.xg88.cc-七彩投资是真的吗| www.48rl.com-张星彩技能-| www.1926.me-天天中彩客服| www.8698.com-欢迎光临金利彩票网| www.89931.com-福彩3d小七精选| www.083833.com-双色球彩票指南诗谜| www.202001.com-福彩藏机图排列三图| www.379921.com-彩票分站-| www.551342.com-财神彩票站-| www.666610.com-国家彩票培训师| www.788792.com-310彩票推荐| www.905824.com-中国福利彩种| www.987620.com-汇彩网登录主页| www.lt1.com-香港人人彩票| www.qu62.com-福彩王素英视频| www.44ew.com-彩票pk10玩法| www.1463.pw-彩铅画乡村风景| www.00072.com-最新的彩票投注网站| www.58686.com-徐文轩福彩3d讲座| www.115755.com-在镇上开彩票店| www.201011.com-快三官方投注站| www.288883.com-玩吉林快三的微信群| www.461953.com-彩票藏机图天气网| www.569099.com-福利彩票14名领导| www.659720.com-双彩球开奨-| www.824930.com-中国梦想彩票触屏版| www.909111.com-新加坡华乐彩票中心| www.981874.com-3d福彩中国彩吧| www.eg35.com-中国福利彩票6+1| www.wh99.com-51中彩彩票软件| www.48um.com-全彩漫画之三国无惨| www.1233.cc-云南快乐彩十分电脑| www.06927.com-福利彩票双色球软件| www.73028.com-合盈彩票网可信吗| www.095369.com-彩票作假吗-| www.175251.com-大发快三代理| www.329028.com-首存1元送58彩金| www.418767.com-我要下载152彩票| www.541906.com-足彩即时比分奥客| www.703128.com-竞彩完场比分完整版| www.790788.com-福彩双色球大彩网| www.877073.com-163彩票网-| 好运彩票www.333hy.cc| www.gw97.com-爱乐透彩票新版下载| www.e82.top-彩票大厅双色球| www.47jj.com-洛阳金手指足彩推荐| www.0631.win-旺达彩票可以信任吗| www.13346.com-足彩串怎么算倍数| www.74109.com-幸运之门彩票大全| www.069284.com-彩票双胆怎么算出来| www.181481.com-福彩快了十分走势图| www.268316.com-手机彩票双色球购买| www.432027.com-体彩贵州11-| www.532672.com-星彩网登录-| www.662709.com-更多精彩点此进入| www.750938.com-98098彩票信誉| www.851068.com-彩礼4万6-| www.912458.com-聚众买彩票犯法吗| www.002772.cc-辽宁福彩3d走试图| www.123146.com-酷彩吧提现-| www.216488.com-乐和彩开奖时间| www.298469.com-东北快三-| www.380380.com-分分乐彩-| www.609395.com-国民彩票时时彩| www.686952.com-竞彩500比赛直播| www.768568.com-百盈大发快三计划| www.931095.com-彩八仙人工计划官网| www.993488.com-彩票上的签名区| www.ax0.com-彩票快3走势图长春| www.or48.com-优彩票-| www.2629.cc-戚泥丝彩票软件下载| www.9389.com-越南博彩合法吗| www.62016.com-手机大赢家彩票| www.310217.com-今日快三中奖规律| www.388144.com-华彩在线靠谱吗| www.556783.cc-注册福利彩票多少钱| www.631289.com-k彩彩票网站合法吗| www.706493.com-玩黑彩票犯法吗| www.787367.com-雪园缘足彩比分直播| www.865021.com-彩友彩票-| www.931895.com-彩票数字范围| www.979449.com-解福彩臧机图| www.vs32.com-福建省体育彩票论坛| www.14sc.com-安徽彩票兑奖| www.094.cm-牛彩彩票下载安装| www.3675.live-万彩吧和彩期期准| www.997084.com-3d褔彩迷语-| www.cr35.com-彩客网app-| www.i88.top-全国彩票计划9cb| www.48xv.com-彩票站点怎么开| www.416700.com-中体彩科技电脑| www.526875.com-腾讯时时彩后二双胆| www.671157.com-p三彩经网走势图| www.751224.com-彩票巴巴网址| www.820149.com-足彩富翁-| www.890277.com-谁有合法彩票平台| www.960938.com-热点彩票-| 福彩www.86267k.com| www.gf92.com-福彩快三游戏大全| www.xy72.com-体彩官方app停售| www.22og.com-彩票投注免费领彩金| www.1709.cn-中一等奖彩票图片| www.8165.vip-七星彩在线选号| www.29858.com-江苏快三倍投绝对赚| www.73544.com-时时彩博-| www.023774.com-明晚七乐彩预测号码| www.095262.com-我玩彩-| www.160163.com-百胜快三是不是真的| www.301946.com-七星彩今期的神算子| www.368944.com-尼彩手机是智能机吗| www.458351.com-梦到彩票没中奖| www.544452.com-百度中彩彩票网| www.647889.com-四川省中国体育彩票| www.805328.com-为什么竞彩没有中超| www.880672.com-福彩双色球攻略| 天天彩票www.106396.com| www.ga39.com-福利彩票的宗旨| www.wp88.com-江苏快三遗漏号码| www.11vt.com-合肥体育彩票中心| www.76ji.com-广州福彩站申请条件| www.1344.net-福彩七乐彩| www.04362.com-用微信怎么买彩票| www.46892.com-时时彩平台软件| www.87954.com-体彩p3预测分析| www.038897.com-周一中国3福利彩票| www.175827.com-彩神8快3大发| www.258097.com-全民福彩是真的假的| www.327682.com-彩票榜app注册| www.390108.com-幸福彩彩票下载安装| www.39ao.com-杭州体彩网征召| www.377.com-体彩七星彩牛材网| www.3667.in-旺彩双色球软| www.8550.top-哈尔滨市福彩中心| www.52911.cc-绿好彩烟-| www.92308.com-下彩票丅x4cc| www.048455.com-彩吧p3图谜第二版| www.148358.com-皇都彩票一彩种| www.231895.com-彩中彩平台-| www.298507.com-兰州体彩大乐透| www.361639.com-下期彩票开奖时间| www.442482.com-福彩平台刷单| www.525996.com-双色球彩88网| www.658535.com-彩视最长时间| www.737792.com-时时彩后三组六计划| www.806877.com-山东彩票下载安装| www.874976.com-竞彩258下载| www.956789.com-儿童彩泥手工大全| www.994452.com-七星彩倍数-| www.cp99.com-一定牛彩票网| www.jj52.com-网上买彩票算诈骗吗| www.yg75.com-腾讯分分彩漏洞百出| www.13lm.com-七乐彩尾号走势| www.72mq.com-解密福彩大底| www.0411.site-香港福彩开奖结果| www.9122.in-浙江休彩6十1开奖|