Skip to Main Content

Responsive Drop-Down Navigation with SelectNav (JS)

Posted on 6.18.2012

There's a whole lot of interest right now on the part of both designers and those that employ them to make their digital properties as accessible as possible - meaning that they must work and appear well on desktop and mobile devices simultaneously.

As an industry we are learning how to make the most of responsive design and to our great fortune, there are numerous techniques and technologies to support this initiative. Case in point - SelectNav.js.

SelectNav.js is a JavaScript plugin that enables designers to convert their website navigation into a "select" drop-down menu (see images below). The JavaScript is used together with media queries to create a space-saving, responsive navigation for those using small-screen devices.

Inspired by TinyNav.js, SelectNav.js requires no external library, is very lightweight (only 1.5kb minified), is customizable, and compatibility with a variety of modern browsers.

Leave Your Comment

Login to Comment

Become a Member

Not already a part of our community?
Sign up to participate in the discussion. It's free and quick.

Sign Up

 

Leave a comment
    Load more comments
    New code
  •    

    The Ultimate Guide to Personalization

    Kibo