+1-888-365-2779
Try Now
More in this section

Forums / Designing with Sitefinity / Controlling the direction of Sitefinity drop down navs

Controlling the direction of Sitefinity drop down navs

8 posts, 0 answered
  1. James@Nw
    James@Nw avatar
    265 posts
    Registered:
    05 May 2009
    29 Sep 2010
    Link to this post
    Hi Guys,

    I need for my last menu item's drop down menus to appear on the inside of the site, rather than the outside as Sitemenu currently does.

    So it I mouse over the last menu on my horizontal menu > move down my drop down menu > and it's child menu comes out, it needs to point inside and not outside as the attached image shows. Can you please let me know how I can control the menu better?

    Many thanks!
    James
  2. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    29 Sep 2010
    Link to this post
    Hello James,

    Thank you for using our services.

    This can be achieved in two ways. The first is to use server side code and get the last top level menu item and set expand direction on its children to be left:
    protected void Page_Load(object sender, EventArgs e)
    {
        RadMenu1.DataBound += new EventHandler(RadMenu1_DataBound);
    }
     
    void RadMenu1_DataBound(object sender, EventArgs e)
    {
        foreach (RadMenuItem item in RadMenu1.Items[RadMenu1.Items.Count - 1].Items)
            item.GroupSettings.ExpandDirection = ExpandDirection.Left;
    }

    The second approach would be through jQuery.

    1) you need to get the top level <li> element with CSS class rmLast

    2) get all child elements of the above item of type span which have the CSS rmExpandRight and substitute this class with rmExpandLeft.

    Best wishes,
    Radoslav Georgiev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. James@Nw
    James@Nw avatar
    265 posts
    Registered:
    05 May 2009
    29 Sep 2010
    Link to this post
    Super, thanks Radoslav!

    I will give that a try. My only concern is that if I use jQuery and the client adds more and more menu items that the jquery might not work in the long run.

    Do you think that the server side code is the better route to go in the long run?

    Thanks,
    James
  4. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    29 Sep 2010
    Link to this post
    Hi James,

    The server side solution looks easier to me. The jQuery one will be slower depending on how many html elements are on the page and the number of items as well. One thing to note here is that the sample form my previous response sets the direction only to the first levels of child items. You will have to use recursion for each item to go into the deepest level.

    Greetings,
    Radoslav Georgiev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  5. James@Nw
    James@Nw avatar
    265 posts
    Registered:
    05 May 2009
    01 Oct 2010
    Link to this post
    Hi Radoslav,

    Thanks for your recommendations, we will most likely implement the server side solution.

    Cheers,
    James
  6. James@Nw
    James@Nw avatar
    265 posts
    Registered:
    05 May 2009
    11 Oct 2010
    Link to this post
    Hi Radoslav,

    I have tried the jQuery option and found that this option is not going to work too well because the class name is being injected only on mouse over of the rmLast.

    I did try and implement the css Class name switch only on hover of rmLast but this was not successful either.

    Since I am a complete beginner at server side code, could you please tell me where I need place your code in my project please?

    Thanks,
    James
  7. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    09 Dec 2016
    11 Oct 2010
    Link to this post
    Hello James,

    This is the server side event of the RadMenu control. If you use SiteMenu  control, it is located inside Sitefinity/UserControls/Navigatio35/SiteMenu.ascx.cs. You could take a look at Controlling the Layout of Child Items and



    Kind regards,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  8. James@Nw
    James@Nw avatar
    265 posts
    Registered:
    05 May 2009
    11 Oct 2010
    Link to this post
    Thanks Ivan!

    I got it working using your server side code :)
Register for webinar
8 posts, 0 answered