Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
I am trying to get the current tab to be highlighted on a navigation bar to make my pager look more user friendly.
 
I have been unable to use css as the the pseudo classes only work when the page is clicked and reverts to page visited rather than active.
 
I understand JQuery can be used in this case.
I have an empty jquery script at the bottom of my master page.
 
my html in my masterpage is as follows:
 
         <div class="clear hideSkiplink">
                <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" 
                    EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal" 
                    onmenuitemclick="NavigationMenu_MenuItemClick">
                    <Items>
                        <asp:MenuItem NavigateUrl="~/Index.aspx" Text="Home" />
                        <asp:MenuItem NavigateUrl="~/About.aspx" Text="About"/>
                        <asp:MenuItem NavigateUrl="~/Contact.aspx" Text="Contact"/>
                        <asp:MenuItem NavigateUrl="~/Admin/EditPageContent.aspx" Text="Edit Conetent"/>
                        <asp:MenuItem NavigateUrl="~/Portfolio.aspx" Text="Portfolio"/>
                        <asp:MenuItem NavigateUrl="~/Admin/AddToPortfolio.aspx" Text="Manage Portfolio"/>
                    </Items>
                </asp:Menu>
            </div>
 
i am not sure what jquery to use to make the background change stay until anothe rmenu item is clicked.
Posted 28-Feb-13 1:20am
Edited 28-Feb-13 4:18am
v2

1 solution

Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

One of the quickest solution I would suggest is that put the below code on every page load and replace "Home" with every page name.
 
Note: There could be many other ways of doing this... One of the quickest way is server side coding as you have only 6 pages.
 
if (!IsPostBack)
            {
                Menu M = (Menu)this.Master.FindControl("NavigationMenu");
                foreach (MenuItem item in M.Items)
                {
                    if (item.Text == "Home")//Replace Home with the page name
                    {
                        item.Selected = true;
                    }
                }
            }
  Permalink  
Comments
Member 9599975 at 28-Feb-13 15:30pm
   
I have added the code to my page but it does not work.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
0 OriginalGriff 393
1 Sergey Alexandrovich Kryukov 232
2 Richard Deeming 180
3 Snehasish_Nandy 171
4 ChauhanAjay 170
0 Sergey Alexandrovich Kryukov 6,367
1 OriginalGriff 5,588
2 CPallini 2,473
3 Richard MacCutchan 1,627
4 Abhinav S 1,530


Advertise | Privacy | Mobile
Web01 | 2.8.140821.2 | Last Updated 28 Feb 2013
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100