ASP.NET Horizontal Menu Control: ASP Alliance

Print Add To Favorites Email To Friend Rate This Article
ASP.NET Horizontal Menu Control

page 3 of 5

by Bryian Tan
Feedback

Average Rating: This article has not yet been rated.
Views (Total / Last 10 Days): 66658/ 49

Article Contents:

Points of Interest

The hover menu appears to not working on mobile devices. To remedy this problem, I include a TreeView control and set its visible property to false. This control expands its entire node by default. That will take care of the mentioned problem. In the code behind, hide the Menu control and show the TreeView control if requesting browser is a mobile device. See listing 9.

Listing 9

protected void Page_Load(object sender, EventArgs e)
    {
      if (Request.Browser.IsMobileDevice)
        {
            NavigationMenu.Visible = false;
            NavigationTreeView.Visible = true;
        }
}

When I tested the menu on IE 8, the hover menu did not render correctly. To overcome this problem, I set the DynamicMenuStyle z-index to 200, see style.css. The submenu is also not working with Google Chrome. After some research, I found the solution for it. See listing 10.

Listing 10

protected void Page_Load(object sender, EventArgs e)
    {
      if (Request.UserAgent.IndexOf("AppleWebKit") > 0)
        {
            Request.Browser.Adapters.Clear();
            NavigationMenu.DynamicMenuStyle.Width = Unit.Pixel(120);
        }
}

« (Page 2)

View Entire Article

(Page 4) »

User Comments

Title: How do i
Name: Sagar Joshi
Date: 2010-11-05 11:48:20 PM
Comment:
Hey.its a nice work.But i want a menu in which parent is Home.aspx then its child default.aspx & default2.aspx.Then again Parent Contact.aspx its child Address.aspx,Phone.aspx.I dont know how to arrange it in sitemap.Menu should be
Home-default,default
Contact-Address,Phone.
Home & Contact are on same hierarchy level.Plz help me on this.

Title: menu control
Name: surinder bedi
Date: 2010-10-29 3:47:28 AM
Comment:
i'm asking about how to link menu items to other pages like by clicking "home" we should move to that particular page.

Title: how to download this demo
Name: Bryian Tan
Date: 2010-09-14 1:14:30 AM
Comment:
Hello Nancy,

The link is located at the bottom of the article, please follow this link http://blog.ysatech.com/post/2009/12/14/ASP-NET-Horizontal-Menu-Control.aspx to download the latest source code.

Thanks,
Bryian Tan

Title: how to download this demo
Name: Nancy
Date: 2010-09-13 11:08:49 PM
Comment:
Hi,

how do i download this Demo. I couldn't find the download link.

Thanks,
Nancy

Title: Working perfectly in Firefox not in IE8
Name: Jagadish
Date: 2010-08-16 7:07:47 AM
Comment:
it a good project for learners using menu control
but i want to learn menus using sql data base
if u know that plz send me to my mail and my mail id is;jagadish1883@gmail.com

Title: Working perfectly in Firefox not in IE8
Name: Bryian Tan
Date: 2010-03-29 6:52:45 PM
Comment:
Elangesh,

Please get the latest code from here:

http://blog.ysatech.com/post/2009/12/14/ASP-NET-Horizontal-Menu-Control.aspx

Thanks,
Bryian Tan

Title: Working perfectly in Firefox not in IE8
Name: Bryian Tan
Date: 2010-03-29 6:50:27 PM
Comment:
Elangesh,

Did the demo work well on IE8?

Thanks,
Bryian Tan

Title: Working perfectly in Firefox not in IE8
Name: Elangesh
Date: 2010-03-29 6:37:15 AM
Comment:
Hi,

I just downloaded and extracted this very good project and instantly found this works well in Firefox 3.6.2 and not working in IE8. It is a real strange. Can any one help me on this?

Many thanks,
Elangesh

Title: Help required for role based Menu
Name: Bryian Tan
Date: 2010-03-22 7:44:06 PM
Comment:
Hello,

Try change this line in the .sitemap
<siteMapNode url="" title="" description="" Text=""> TO

<siteMapNode url="" role="*" title="" description="" Text="">

http://msdn.microsoft.com/en-us/library/ms178428.aspx

Thanks,
Bryian Tan

Title: Help required for role based Menu
Name: aman kumar
Date: 2010-03-22 1:08:56 AM
Comment:
Hello,

When I am using this menu control withthe given below section in Web.config then the menu control is getting disappeared rather than trimming the Menu control according to the roles.

securityTrimmingEnabled="true

Please help on this.

Aman kumar

Title: Feedback
Name: Manish
Date: 2010-02-21 8:35:21 AM
Comment:
Good one!

Title: New Update
Name: Bryian Tan
Date: 2010-02-04 12:49:56 AM
Comment:
Hello,

Thanks for the feedback. I have updated the article and source code. http://blog.ysatech.com/post/2009/12/14/ASP-NET-Horizontal-Menu-Control.aspx

Please try the demo again http://download.ysatech.com/ASP-NET-Menu-Control/ and let me know how it goes.

Thanks,
Bryian Tan

Title: I agree
Name: G W
Date: 2010-02-03 3:13:11 PM
Comment:
I agree with Kelly. I'm seeing the same thing in both browsers.

Title: Not working right in Chrome
Name: Kelly D
Date: 2010-02-03 1:00:12 AM
Comment:
Another observation, your Chrome fix isn't working in my Chrome (not right away anyway..). When the page first loads in my Chrome (Chrome 4.0.429, Vista Home), all the menu items are stacked on top of each other until I click on any of the menu items for the first time and then they all line up properly in the horizontal menu. Plus, the Menu5A submenu flyouts are all gapped apart.
...geez, I though the days of browser incompatibilities were finally over once everybody adopted a standard. Guess not. (probably MS fault. ASP.Net not strictly complying with standards..)

Title: TreeView displaying in IE8
Name: Kelly D
Date: 2010-02-03 12:43:18 AM
Comment:
I don't know if this is happening to everybody or not, but in my IE8, your demo is displaying the TreeView instead of the horizontal menu. Makes me think that IE8 (at least mine anyway, p.s. mine is IE8 in Vista Home..) is triggering your Browser.IsMobileDevice code for some reason.

Product Spotlight