?當我鼠標劃過學習中心 會出現(xiàn)二級菜單 可是當我劃過學習中心， 而二級菜單還沒有顯示完全，?很快把它在移動到別的鏈接上然后再移回學習中心。而導致二級菜單顯示沒有完成使得其菜單卡在那里。。請問這個bug 怎么解決啊<!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></title>??? <style type="text/css">??????? .top-nav??????? {??????????? font-size: 14px;??????????? font-weight: bold;??????????? list-style: none;??????? }??????? .top-nav li??????? {??????????? float: left;??????????? margin-right: 1px;??????? }??????? .top-nav li a??????? {??????????? line-height: 34px;??????????? text-decoration: none;??????????? background: #3f240e;??????????? color: #fff;??????????? display: block;??????????? width: 80px;??????????? text-align: center;??????? }??????? ??????? .top-nav ul??????? {??????????? list-style: none;??????????? display: none;??????????? padding: 0;??????????? position: absolute;??????????? height: 0;??????????? overflow: hidden;??????? }??????? ??????? .top-nav li a:hover??????? {??????????? background: url(http://img1.sycdn.imooc.com//5461b50d0001e28000010034.jpg) 0 0 repeat-x;??????? }??????? .note??????? {??????????? color: #3f240e;??????????? display: block;??????????? background: url(http://img1.sycdn.imooc.com//5461b50d0001e28000010034.jpg) 0 0 repeat-x;??????? }??????? .corner??????? {??????????? display: block;??????????? height: 11px;??????????? background: url(http://img1.sycdn.imooc.com//5461b5620001410d00170011.jpg) 31px 0 no-repeat;??????? }??? </style>??? <script type="text/javascript">??????? window.onload = function () {??????? ?????? //鼠標經過時的效果??????????? var Lis=document.getElementsByTagName("li") ;?? ???????????? for(var i=0;i<Lis.length;++i){?? ???????????????? Lis[i].onmouseover = function () {??????????????????? var u = this.getElementsByTagName("ul")[0];??????????????????? if (u != undefined) {??????????????????????? u.style.display="block";??????????????????????? ChangeH(u.id,1);??????????????????? }??????????????? }??????????????? ??????????????? ??????????????? ??????????????? Lis[i].onmouseleave = function () {??????????????????? var u = this.getElementsByTagName("ul")[0];??????????????????? if (u != undefined) {??????????????????????? ChangeH(u.id,-1);??????????????????? }??????????????? }??????????? }??????? }??????? function ChangeH(id, count) {??? //??? 根據ID找到ulList，同時得到其高度??????????? var ulList = document.getElementById(id);??????????? var h = ulList.offsetHeight;?????????????? h += count;??????????? if (count > 0) {??????????????? if (h <= 42) {???//?將高度賦值給ulList，同時，不斷調用本函數(shù)??????????????????? ulList.style.height = h + "px";??????????????????? setTimeout("ChangeH('" + id + "',1)", 10);??????????????? }??????????????? else {??????????????????? return;??????????????? }??????????? }??????????? else {??????????????? if (h > 0) {??//?將高度賦值給ulList，同時，不斷調用本函數(shù)??????????????????? ulList.style.height = h + "px";??????????????????? setTimeout("ChangeH('" + id + "',-1)", 10);??????????????? }??????????????? else {??????????????????? ulList.style.display = "none";??????????????????? return;??????????????? }??????????? }??????? }??? </script></head><body>??? <ul class="top-nav">??????? <li><a href="#"><span class="note">慕課網</span></a> </li>??????? <li><a href="#">課程大廳</a> </li>??????? <li><a href="#">學習中心</a>??????????? <ul id="mnuUL">??????????????? <span class="corner"></span>??????????????? <li><a href="#">前端課程 </a></li>??????????????? <li><a href="#">手機開發(fā)</a> </li>??????????????? <li><a href="#">后臺編程</a></li>??????????? </ul>??????? </li>??????? <li><a href="#">關于我們</a></li>??? </ul></body></html>
代碼出現(xiàn)點buy
keida
2015-05-02 17:21:38
