Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

67 lines (47 sloc) 1.367 kb

jQuery Mobile navigation

Transform your main navigation into a select object for mobile browsers.



Download jquery.mobileNav.js (required jQuery)


You can also change the default Parameters


    classNav: 'mobile-nav', // class of the select navigation
    idNav: 'mobile-nav', // id of the select navigation
    container: $('.header nav'), // element wrapping the select navigation
    label: 'Navigation', // text value on first option select nav



Of course you can change the CSS for your consideration

    .mobile-nav {
      display: none; /* hide the select nav by default */
    @media only screen and (max-width: 781px) {
      .menu {display: none;} /* hide the main navigation */
      .mobile-nav {display: block; min-width: 460px;} /* show the select navigation */
    @media only screen and (max-width: 481px) {
      .mobile-nav {min-width: 320px;} /* change width for smaller screen */


Vincent Bianciotto

Copyright and licence

Dual licensed under MIT and GPL.

Jump to Line
Something went wrong with that request. Please try again.