2011年6月18日 星期六

改善 ASP.Net Menu 控制項點擊有效區域太小的問題

使用過 ASP.Net Menu 控制項的朋友都會發現這個問題:點擊有效區域 (也就是會變成手型游標的區域) 僅限於功能表的文字部份,但是 Hover 的效果卻及於功能表項目的全部。導致「雖然看到功能表項目變色了,但是點擊無效,必須游標變成手型才可以」,而讓使用者有不好的操作體驗。

如何解決這個問題?靠一點 css 的輔助就可以了。
將以下的 css 加入您的 css 檔

a.menu
{ display:block; width:100%; height:100%; padding-top:8px; } a.menu:hover { background-color: Gray; }

然後設定 Menu 控制項的 StaticMenuItemStyle 以及 DynamicMenuItemStyle 的 CssClass="menu"
a.menu 中的 padding-top:8px,以及 a.menu:hover 需要依照實際狀況做調整

這樣套用之後,功能表的點擊有效區域就可以括及功能表項目的全部範圍了

沒有留言: