用js和css模擬ajax dijit menu

摘要:用js & css模擬ajax dijit menu

如上,User又說 能不能把子選單疊在主選單的2/3呀?(= =|...我毒啞你)

大家要不就用tree 要不就都用成這種popitem在右邊的(比較不會遮住字),竟然想要疊上主選單

偏偏又找不到啥很符合的code,只好自己含淚重頭寫

寫完發現,dojo 的menu 應該可以拿掉了= =||無言,這...給user去決定吧

(function padLeft 位元不足補0用):

code如下:

<style type="text/css">
A:link,A:visited{
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 12px;
 line-height: 18px;
 color: #555555;
 text-decoration: none;
}
A:hover{
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 12px;
 line-height: 18px;
 color: #555555;
}

.a_mo{
position:absolute;width:120px;left:100px;background-image:url('/images/btn__0402.jpg');z-index:2;border: 1px none #6B9636;display:none
 }
</style>

<script language="javascript">
a_mo4=3 //2 sub;
//function displaymainmenu(){mainmenu.style.visibility="visible";}

function padLeft(str,lenght){  
  if(str.length >= lenght)  
   return str;  
  else 
   return padLeft("0" +str,lenght);  
}

//alert(padLeft('9',2));

function hidemainmenu(){
for(i=1;i<a_mo4;i++)
eval('sonmenu'+padLeft(String(i),2)+'.style.display="none"')}

function displaysonmenu(n){
for(i=1;i<a_mo4;i++)
eval('sonmenu'+padLeft(String(i),2)+'.style.display="none"');
x=eval(n);x.style.display="block";}

function hidesonmenu(n){
for(i=1;i<a_mo4;i++)eval('sonmenu'+padLeft(String(i),2)+'.style.display="none"')}
</script>

<div id="mainmenu"  style="position:absolute">
<table width="189"  border="0" cellspacing="0" cellpadding="0">
<已計算完值>
</table>
</td></tr>
</table>
</div>

動態計算的值如下:

<tr  valign="top">
<td  width="189" height="37" background="/images/左邊選單/m_03.jpg" onmouseover="javascript:displaysonmenu('sonmenu01')">  <table width="90%" id="sonmenu01" class=a_mo onmouseout="hidesonmenu()"> <tr><td><a href="http://ww.google.com.tw">C.Y.</a></td></tr> <tr><td><a href="http://ww.google.com.tw">Milin</a></td></tr> <tr><td><a href="http://ww.google.com.tw">與您有約</a></td></tr>  </table></td></tr><tr  valign="top">
<td  width="189" height="37" background="/images/左邊選單/m_04.jpg" onmouseover="javascript:displaysonmenu('sonmenu02')">  <table width="90%" id="sonmenu02" class=a_mo onmouseout="hidesonmenu()"> <tr><td><a href="http://ww.google.com.tw">HR關懷信箱</a></td></tr> <tr><td><a href="http://ww.google.com.tw">溝通與交流</a></td></tr>