locked
Selected menu item style stays after postback or page redirect RRS feed

  • Question

  • User-969659544 posted

    This is probably a simple question, but CSS sometimes drives me insane.

    I have a Menu control on a page, with text-decoration:none for all the menu items.  There is only one level to the menu.

    When you hover, the background changes color for that li.  Once some text is clicked and the page loads, the hover color is gone.

    Is there a way to keep the hover color, after a selection?

    I am basically trying to accomplish what you see in the main menu of the www.iis.net site.

    Thanks, CSC

    Wednesday, November 19, 2008 2:34 PM

Answers

  • User-1228306975 posted

    in IIS.net they are using class name  "current_item" for current selected page. [in this case page "Get Started" is selected ]

    <ul class="nav_main">
                <li class="first"><a target="_top" href="/default.aspx?tabid=1">Home</a></li>
                <li class="current_item"><a target="_top" href="/default.aspx?tabid=2">Get Started</a></li>
                <li><a target="_top" href="/default.aspx?tabid=900">Learn</a></li>
                ......................

    </ul>

    If you change the page to "Learn" then you need to code like following way

    <ul class="nav_main">
                <li class="first"><a target="_top" href="/default.aspx?tabid=1">Home</a></li>
                <li ><a target="_top" href="/default.aspx?tabid=2">Get Started</a></li>
                <li class="current_item"><a target="_top" href="/default.aspx?tabid=900">Learn</a></li>
                ......................

    in this way for each page u need to change class "current_item" either manually or using javascript technique

     

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, November 20, 2008 4:45 PM

All replies

  • User-955326108 posted

    Hello,

    I don't know if I understand you 100%, but if I did in some way, try the a:visited in your stylesheet.

    Cheers!

    /Eskil

    Wednesday, November 19, 2008 4:56 PM
  • User-969659544 posted

     My CSS is bad, so I am probably doing a poor job explaining.

    I am trying to achieve the same thing you see on the www.asp.net and www.iis.net site to name a few.  When you select a place to go from the main menu, that item stays selected so the user knows where they are in the site.

    I have a horizontal menu created with the CSS Adapters that contains: Process, Inventory, Traffic as choices.  Each choice will take you to a different page in the site.

    When you hover over an item, that item in the menu changes color.  Once you click it and go to the new page, the color change is gone. Can you make the color change persist between pages or does that require some javascript or something?

    Using a:visited will change the link so long as I stay on the same page.


    Thursday, November 20, 2008 4:14 PM
  • User-1228306975 posted

    in IIS.net they are using class name  "current_item" for current selected page. [in this case page "Get Started" is selected ]

    <ul class="nav_main">
                <li class="first"><a target="_top" href="/default.aspx?tabid=1">Home</a></li>
                <li class="current_item"><a target="_top" href="/default.aspx?tabid=2">Get Started</a></li>
                <li><a target="_top" href="/default.aspx?tabid=900">Learn</a></li>
                ......................

    </ul>

    If you change the page to "Learn" then you need to code like following way

    <ul class="nav_main">
                <li class="first"><a target="_top" href="/default.aspx?tabid=1">Home</a></li>
                <li ><a target="_top" href="/default.aspx?tabid=2">Get Started</a></li>
                <li class="current_item"><a target="_top" href="/default.aspx?tabid=900">Learn</a></li>
                ......................

    in this way for each page u need to change class "current_item" either manually or using javascript technique

     

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, November 20, 2008 4:45 PM
  • User-969659544 posted

    Thanks. 

    I am using the CSS Friendly Control Adaptor for the menu.  How would I dynamically set the class of the "current" page?  Does this control supply a method/property or is it custom javascript?

     

    Friday, November 21, 2008 1:43 PM