视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
html5仿AMD9官网酷炫的下载引导页动画特效的示例代码
2020-11-27 15:10:07 责编:小采
文档
 一直做后台的,但是最近对前端还是有点兴趣的,比较火的H5,于是用http://www.gxlcms.com/wiki/1118.html" target="_blank">html5仿AMD9官网酷炫的下载引导页动画特效案例,下面分享给大家,当然本人只是初学者;大神莫喷哦;

效果图:

具体完整代码如下:请不要使用记事本打开,最好用notpad++编写代码!!

<!DOCTYPE html>
<html>
<meta charset=UTF-8>
<meta http-equiv=X-UA-Compatible content="IE=edge">
<link rel="shortcut icon" href="/favicon.ico">
<link rel=bookmark href="/favicon.ico" type=image/x-icon>
<title>高仿 -- AMD9 : 精彩,一下就有</title>
<link rel=stylesheet href="css/style.css">
<div id=wrap>
<div>
<div>
<div class="head clearfix">
<div>
<h1>AMD9</h1>
<a href='javascript:;'><img src="img/logo.png" alt=xxx></a>
</div>
<div id=nav_box>
<ul>
<li>
<a href='javascript:;' target=_blank clickid=guanwang_navigation_homepage>主页</a>
<li>
<a href='javascript:;' target=_blank clickid=guanwang_navigation_productcenter>产品中心</a>
<li>
<a href='javascript:;' target=_blank clickid=guanwang_navigation_customer>客服论坛</a>
<li>
<a href='javascript:;' target=_blank clickid=guanwang_navigation_yangtai>AMD阳台</a>
</ul><span></span></div>
</div>
</div>
<div id=page_wp>
<div class="page page_1"><span class="page_bg scale_box"></span>
<div><img src="" alt=""></div>
<div class="txt_box scale_box">
<h2>新一代AMD将呈现更多精彩</h2>
<p>从现在开始,你就会感觉到它与以往是如此不同。全新的界面体验,高速的引擎支持,丰富的内容推荐,这一切,都让你的生活更加精彩。</div>
</div>
<div class="page page_2"><span class="page_bg scale_box"></span>
<div><img src="" alt=""></div>
<div class="txt_box scale_box">
<h2>高速引擎可以带你穿越时空</h2>
<p>我们对速度的渴望从未停止,一起来体验速度超频的感觉。它的技术服务会更加稳定,占用更少的资源提供更高的速度支持,这一切只源于我们对技术的无尽追求。</div>
</div>
<div class="page page_3"><span class="page_bg scale_box"></span>
<div><img src="" alt=""></div>
<div class="txt_box scale_box">
<h2>与你一起发现更多精彩资源</h2>
<p>它以生动的方式呈现更多内容,让你在体验极速的同时,拥有更多选择。热门游戏,热辣直播,高清美图,我们准备好了一切,就等你来探索</div>
</div>
<div class="page page_4"><span class="page_bg scale_box"></span>
<div><img src="" alt=""></div>
<div class="light_wp scale_box"><span><i></i> <i></i> <i></i> <i></i> <i></i></span></div><span class="meteor_box scale_box"></span>
<div class="txt_box scale_box">
<h2>还有另一个自己在这里等你</h2>
<p>当你使用AMD的同时,也许另一个人也和你一样,在下载、在观看同样的东西。这些只是开始,新一代AMD使用越久,越能发现它的创新和诚心。</div>
</div>
</div>
<div class="star_wp scale_box" id=star_wp><span></span> <span></span></div><canvas id=canvas></canvas>
<div class="btns_wp scale_box">
<a class="btn_download JS-btn-download" href='javascript:;'>立即下载</a>
</div>
<div id=btn_control>
<a href=javascript:;></a>
<a href=javascript:;></a>
<a href=javascript:;></a>
<a href=javascript:;></a>
</div>
<div>
<div>
<p>? XXXX-2016 XXXX 版权所有</div>
</div>
</div>
</div>
<script src="./js/vendors.js"></script>
<script src="./js/index.js"></script>
<!--[if IE 6]>
<script type="text/javascript" src="http://static.webgame.kanimg.com/com/DD_PNG_min.js"></script>
<script type="text/javascript">
var links=document.getElementsByTagName("a");
for(var i=0,l=links.length;i<l;i++){
links[i].setAttribute("hideFocus",true);
}
</script>
<![endif]-->

下载本文
显示全文
专题