Responsive Design - Navigation

Posted by Community Admin on 05-Aug-2018 13:56

Responsive Design - Navigation

All Replies

Posted by Community Admin on 14-Nov-2013 00:00

Hi,
Does anyone know how to accomplish the responsive design like this Sitefinity template?

centinyx.tornadoapplications.com/

The Sitefinity options for transforming navigation are limited to dropdown and 'toggle vertical'

Posted by Community Admin on 15-Nov-2013 00:00

This is done purely with CSS & Javascript.  For the full width view the <li> and set to display:inline-block; and the Mobile view the are set to display:block; and the <ul> is show or hide based on clicking the menu <div>

Posted by Community Admin on 15-Nov-2013 00:00

I see, does it need Javascript then? Surely it could be done via CSS only using @media in the CSS file eg:
@media only screen and (max-width: ??px)

Posted by Community Admin on 15-Nov-2013 00:00

The media query is correct and is where you would make the style changes from an inline menu to a vertical menu.  JavaScript will be needed to achieve the menu opening and closing in the mobile and desktop view.

This thread is closed