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

Forums / Designing & Styling / Responsive navigation using SiteFinity OOTB functionality

Responsive navigation using SiteFinity OOTB functionality

2 posts, 0 answered
  1. Luke
    Luke avatar
    56 posts
    Registered:
    18 Mar 2013
    09 Apr 2013
    Link to this post
    Thanks for your time.

    I'm using SiteFinity 5.2 and the OOTB RadMenu to display a very typical horizontal rollout DHTML navigation menu that is three layers deep.

    I am trying to think of a way to preserve this menu on desktop browsers but when resized smaller have the CSS respond with a scaled-back, display appropriate rendered version of the navigation that includes only the 0-level menu and omits all the children.

    My constraints are the following:

    1.) I don't want to build a completely different version of the site for this, I am looking for a responsive solution I can test in real time without a page reload
    2.) I would prefer not to have duplicate the navigation (once for desktop+ sizes, then again with a simpler version for everything < desktop size) and control their visibility with media queries because that sounds inefficient.

     If possible I want to avoid coding customization because (A.) I'm a CMS user, not a bona fide developer and (B.) future SiteFinity upgrades may affect those customizations (what little ASP.NET work I've been involved has always had that customize->update version->regress->start over motif.)

    To provide an example, Twitter Bootstrap's responsive CSS takes their horizontal nav LI-based menu and stuffs it away for toggle show/hide as block level nav items. This pattern provides a simple solution for me to model my navigation on, I just don't know to pull it off with SiteFinity's nested RadMenu.

    Any suggestions are very much appreciated!
  2. Owain
    Owain avatar
    110 posts
    Registered:
    17 Jan 2012
    16 Apr 2013
    Link to this post
    I'd be interested to find a solution for this as well - looking at rebuilding one of the sites I look after to allow for complete responsive design as we have found more and more people are using mobile devices to access our site. 

2 posts, 0 answered