0

私は、ASP メニュー コントロールが選択したメニュー項目を表示していない理由を解決できないように見える、一見無能な .NET 開発者と協力しているフロントエンド開発者です。.NET 開発者から次のコードが送られてきました。CSS を有効にするために必要なルールがいくつかありませんか?

前もって感謝します

コントローラー構成

 <asp:Menu ID="mnuMaster" 
                          runat="server" 
                          DataSourceID="sitemapMaster" 
                          StaticDisplayLevels="1" 
                          MaximumDynamicDisplayLevels="0" 
                          Orientation="Horizontal" 
                          StaticEnableDefaultPopOutImage="False" 
                          CssSelectorClass="TopMainMenu" onmenuitemdatabound="mnuMaster_MenuItemDataBound"
                          StaticBottomSeparatorImageUrl="~/App_Themes/PCTools/Images/top_menu_separator.gif"
                          ></asp:Menu>

CSS 選択クラス

    .TopMainMenu .AspNet-Menu li a:active, .TopMainMenu li.AspNet-Menu-Selected a,.TopMainMenu li.AspNet-Menu-ChildSelected a,.TopMainMenu li.AspNet-Menu-ParentSelected a {
    background:url(Images/navbg.gif) repeat-x 0 -86px;
}
4

2 に答える 2

0

通常、デザイナーが提供する通常の HTML で標準の UL グループを使用し、HTML サーバー タグにします。

他の解決策があるかもしれませんが、私たちが通常行う解決策はこれです。

最初に、最上位の各メニュー項目に ID が必要です。

メニューがマスターページにある場合 (そうであると仮定します)

マスターページのコード ビハインドでは、このようなコードを配置できます。

//Discover currently navigated page TYPE
if (this.Page is `pagetype of the current page`)
    //add a CSS class to the top level menu item
    miFirstMenuItem.Attributes["class"] += " highlightedMenuItemCSSClass";

次に、HTML 出力は、特定のスタイルを適用するメニュー項目に追加の CSS クラスを追加します。

これは、SetActiveTab メソッドのタイプを MenuItem の正しいタイプに変更する必要がある実際のノードの例です。

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            bool homeVisited        = Page is Default;
            bool productsVisited    = Page is Products_List;
            bool demoVisited        = Page is Demonstrations;
            bool contactVisited     = Page is Contact;

            if (homeVisited)
                SetActivePage(hlHome, ButtonSide.Left);
            if (productsVisited)
                SetActivePage(hlProducts, ButtonSide.Middle);
            if (demoVisited)
                SetActivePage(hlDemo, ButtonSide.Middle);
            if (contactVisited)
                SetActivePage(hlContact, ButtonSide.Right);

        }
    }

これは、上で説明した方法とは異なる方法を示していますが、link.Attributes["class"] += " cssClass"; に置き換えることができます。最初の ".

また、ButtonSide は私が追加した列挙型です。これは、特定のケースではすべての中央のメニュー項目が同じ CSS クラスを持ち、左右のメニュー項目も同様であるためです。

    private void SetActivePage(HyperLink link, ButtonSide side)
    {
        if (side == ButtonSide.Left)
            link.CssClass = "currentleft";
        if (side == ButtonSide.Middle)
            link.CssClass = "currentmiddle";
        if (side == ButtonSide.Right)
            link.CssClass = "currentright";
    }
于 2011-05-16T20:28:14.567 に答える
0

VS201 / .Net4 には、asp.menu プロパティ StaticSelectedStyle および DynamicSelectedStyle で指定した CSS クラス名が無視されるというバグがあるようです。メニューは常に「selected」というクラス名を使用します。

于 2011-06-08T10:28:20.223 に答える