日期:2014-05-16  浏览次数:20421 次

切换城市问题

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>code.js.cn</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body,html{margin:0;padding:0;font-size:12px;font: 12px/1.5 arial;background:#A2DDEF;}
#head{background:#454545;height:110px;}
.shell{margin:20px 0 0 50px;}
.shell strong{background:#606060;color:#eee;font-size:16px;padding: 5px 20px;margin-left:60px;}
.shell span{color:#fff;font-size:12px;margin-left:10px;cursor:pointer;}
#logo img{border:none;}
#menu{position:absolute;background:#515151;color:#eee;padding:4px;}
#menu ul,#menu li{margin:0;padding:0;list-style:none;}
#menu li a{display:block;font-size:14px;color:#fff;text-decoration:none;zoom:1}
#menu li a:hover,#menu li.focus a{background:#606060;}
#menu li{float:left;display:inline;width:78px;line-height :25px;text-align:center;margin-left:4px;}
#menu ul{border-bottom:1px dashed #666;float:left;padding:5px;width:340px;}
.menufoot{clear:both;text-align:right;padding:10px;}
.menufoot a{color:#339999;text-decoration:none;padding:5px 10px;}
.menufoot a:hover{background:#606060;color:#339999;text-decoration:none;}
.nav{background:#44ABAF;height:70px;border-top:4px solid #338888;}
</style>
</head>
<body>
<div id="head">
    <div class="shell"><a href="###" id="logo"><img src="http://www.meituan.com/static//css/i/logo.gif" alt="" /></a>
    <strong>深圳</strong><span id="menuBtn">切换城市</span></div>
</div>
<div class="nav"></div>
<div id="menu" style="display:none;">
    <ul>
        <li><a href="" >北京</a></li>
        <li><a href="" >上海</a></li>
        <li><a href="" >武汉</a></li>
        <li><a href="" >广州</a></li>
        <li class="focus"><a href="" >深圳</a></li>
        <li><a href="" >杭州</a></li>
        <li><a href="" >南京</a></li>