Multi-styled navigation

2 posts, 1 answers
  1. John
    John avatar
    19 posts
    Member since:
    Jan 2011

    Posted 10 Aug 2011 Link to this post

    Hi

    How can we have navigation like on the left on this page http://www.gordonramsay.com/thesavoygrill/theatre/Pre_theatre where navigation items have different attributes even when they are not selected or hovered over?

    Thanks

    Regards

  2. Answer
    Kate
    Admin
    Kate avatar
    1898 posts

    Posted 10 Aug 2011 Link to this post

    Hello John,

    To achieve this look you can either use the RadMenu control or the RadTabStrip control and apply the CssClass property along with the right css class selectors (you can refer to the css classes that are applied to the RadMenu here and the RadTabstrip here) in order to alter the appearance of every menu item or tab depending on the control that you are using. For example, using the Menu you could change the text color of an item using the following css class:
    <style type="text/css">
            .new1, .new1 a.rmLink
            {
                color: red !important;
            }
        </style>

    markup:
    <telerik:RadMenu runat="server" ID="Menu1">
            <Items>
                <telerik:RadMenuItem runat="server" Text="Root 1" CssClass="new1">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Root 2">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Root 3">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem runat="server" Text="Root 4">
                </telerik:RadMenuItem>
            </Items>
        </telerik:RadMenu>

    Greetings,
    Kate
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Back to Top