簡體   English   中英

ASP:菜單子項保持可見

[英]ASP:Menu children stays visible

首先,我想說的是,我仍然認為該站點具有最佳答案。 全年對我有很大幫助。 基本上,我到處都看過,但空虛了。

好的,所以我將盡量保持簡單:

  1. 我有一個ASP:Menu,可以從數據庫中檢索數據。 這包括與ID關聯的父母和子女。
  2. 然后將其添加到創建菜單項的遞歸方法中,從而將子級添加到正確的父級中。 -還是不錯。 完美運作。
  3. 然后,它將填充我在網頁上插入的asp:menu控件。 -這里也很好。
  4. 然后,在添加項目之后,asp:菜單會以精美的方式顯示它,我可能會添加它。 所以我在這里也很好。

下一部分是主要問題:

經過3天的苦苦掙扎,我嘗試做最簡單的事情,但絕對無濟於事:顯示父母的所有孩子項目(意味着所有父母的孩子),而無需將鼠標懸停在父母身上並且不使用Javascript。 ASP.Net背后的代碼只有純CSS和HTML以及C#。

我想要以下內容:

  • 從類似:

    nav > ul > li:hover > div{ display: block; opacity: 1; visibility: visible; }

  • nav > ul > li > div{ display: block; opacity: 1; visibility: visible; }

上面的示例代碼基本上意味着不需要懸停在父項上即可顯示子項。 因此,簡而言之,我的asp需要一些類似的東西:菜單父母和孩子。 我只有1個等級的孩子。 這意味着我的孩子沒有孩子。 1個父母有多個孩子,就是這樣。 然后,它傳給其他父母和孩子。

以下是我擁有的數據結構的示例:

  • 公司

    | ---關於我們

    | ---服務

    | ---介紹

    | ---客戶

  • 產品展示

    | ---商業

    | ---住宅

這是我擁有的asp:menu的代碼:

<asp:Menu ID="uxLiteral1" Orientation="Horizontal" runat="server"
OnMenuItemClick="Bottom_Click" SkipLinkText=""
StaticEnableDefaultPopOutImage="False" IncludeStyleBlock="False"/>

據我了解,這可以使用CSS來完成,但是在這一點上,我將盡一切可能。

我為冗長的帖子表示歉意,並在此先感謝您!!

PS:我已經看過StaticDisplayLevels屬性,並且沒有將其添加到彼此之間。 所以這對我不起作用。 我願意使用任何其他控件來完成工作。

編輯 :這是我發現asp:menu生成的CSS代碼,應該使用應該顯示菜單所包含項目的代碼來生成自身,但是目前看來似乎不起作用。

.FooterDetails > .Square > #BotMenu1_UpdatePanel1 > #BotMenu1_uxLiteral1 > ul.static { font-weight: bold; }

.FooterDetails > .Square > #BotMenu1_UpdatePanel1 > #BotMenu1_uxLiteral1 > ul.static > li.static > ul.dynamic > li.dynamic > a.dynamic { font-weight: normal; visibility: visible !important; padding-right: 25px; margin-bottom: 3px; }

靜態類是第一個項目,即我的項目的標題和父項。 在這種情況下,它將是“公司”和“產品”。

動態班級是靜態班級的孩子。

經過努力解決這一問題的第二天,答案似乎很簡單。

給asp:menu一個新的CSS類,如下所示:

<asp:Menu ID="uxLiteral1" runat="server" CssClass="FooterMenu" Orientation="Horizontal"     IncludeStyleBlock="false" StaticEnableDefaultPopOutImage="False"     OnMenuItemClick="NavigationMenu_MenuItemClick" DisappearAfter="0" />

然后將更改CSS,以便菜單及其所有項目僅鏈接到以下CSS:

div.FooterMenu
{
    align-content: center !important;
}

div.FooterMenu ul
{
    list-style: none;
    display: inline-block !important;
}

    div.FooterMenu ul li
    {
        padding-right: 65px;
        margin-bottom: 3px;
    }

這將為您提供顯示每個父項的所有子項而沒有任何懸停效果的理想效果。 同樣,我覺得自己是真正的MVP。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM