<nav> 

    <h1>This menu turns into a &lt;select> when window is less than 500px to conserve space.</h1>
  	
  	<ul> 
  		<li><a href="#" class="active">Home</a></li> 
  		<li><a href="#books">Books</a></li> 
  		<li><a href="#blog">Blog</a></li> 
  		<li><a href="#about">About Us</a></li> 
  		<li><a href="#support">Support</a></li> 
        </ul>
  	
</nav>

    * {
      margin: 0;
      padding: 0;
    }
    h1 {
      font: 300 21px "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
      width: 500px;
      margin: 0 auto 15px;
    }
    nav {
      display: block;
      width: 960px;
      margin: 100px auto;
      text-align: center;
    }
    nav ul {
      list-style: none;
    }
    nav li {
      display: inline-block;
    }
    nav a {
      display: inline-block;
      background: #333;
      color: white;
      padding: 5px 15px;
      border: 1px solid white;
      text-decoration: none;
    }
    nav a:hover {
      border: 1px solid red;
      background: red;
    }
    nav a:active {
      background: blue;
    }
    nav select {
      display: none;
    }
    
    @media (max-width: 500px) {
      nav ul     { display: none; }
      nav select { display: inline-block; }
    }

	 // DOM ready
	 $(function() {
	   
      // Create the dropdown base
      $("<select />").appendTo("nav");
      
      // Create default option "Go to..."
      $("<option />", {
         "selected": "selected",
         "value"   : "",
         "text"    : "Go to..."
      }).appendTo("nav select");
      
      // Populate dropdown with menu items
      $("nav a").each(function() {
       var el = $(this);
       $("<option />", {
           "value"   : el.attr("href"),
           "text"    : el.text()
       }).appendTo("nav select");
      });
      
	   // To make dropdown actually work
	   // To make more unobtrusive: http://css-tricks.com/4064-unobtrusive-page-changer/
      $("nav select").change(function() {
        window.location = $(this).find("option:selected").val();
      });
	 
	 });

see result:
http://jsfiddle.net/fusionpeach/7f9M6/embedded/result/