首页 > 代码库 > 适合安卓手机网页客户端导航代码

适合安卓手机网页客户端导航代码

安卓手机底部四五分页的导航都是比较漂亮的

今天直接给大家推荐这款代码,这样就省得每次自己写了

07104025_RJ1K.jpg

jQuery特效代码:

01<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

02<html xmlns="http://www.w3.org/1999/xhtml">

 

03<head>

 

04<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 

05<title>jquery+css3安卓Android(苹果iphone)桌面底部导航菜单</title>

 

06<link href="http://www.mamicode.com/css/lanrenzhijia.css?v=2" type="text/css" rel="stylesheet">

 

07</head>

 

08 

 

09<body>

 

10<div id="dock-wrapper">

 

11    <div class="dock">

 

12      <div class="dock-front">

 

13            <img src="http://www.mamicode.com/images/arrow-up.png" id="arrow-up" />

 

14      </div>

 

15      <div class="dock-top">

 

16            <img src="http://www.mamicode.com/images/arrow-down.png" id="arrow-down" />

 

17      </div>

 

18    </div>

 

19    <div class="item">

 

20        <img src="http://www.mamicode.com/images/launcher-pro.png" width="60" />

 

21        <img src="http://www.mamicode.com/images/2do.png" width="60" />

 

22        <img src="http://www.mamicode.com/images/antivirus.png" width="60" />

 

23        <img src="http://www.mamicode.com/images/drive.png" width="60" />

 

24        <img src="http://www.mamicode.com/images/plex.png" width="60" />

 

25        <img src="http://www.mamicode.com/images/maps.png" width="60" />

 

26    </div>

 

27  </div>

 

28    <img src="http://www.mamicode.com/images/arrow.png" alt="arrow" id="arrow" />

 

29   

 

30  <script>!window.jQuery && document.write(unescape(‘%3Cscript src="http://www.mamicode.com/js/jquery.min.js"%3E%3C/script%3E‘))</script>

 

31  <script src="http://www.mamicode.com/js/lanrenzhijia.js"></script>//*http://www.huiyi8.com/jiaoben/

 

32  <script src="http://www.mamicode.com/js/modernizr.custom.34807.js"></script>

 

33  <script> if(!Modernizr.csstransforms3d) document.getElementById(‘information‘).style.display = ‘block‘; </script>

 

34</body>

 

35</html>