JSFiddle - React, Tailwind, and code Playground
by harsh dand
HTML
<section id="menu-container">
<nav id="menu">
<ul class="menu_desktop">
<li><a href="javascript:void(0);"><span>Institution</span></a>
<ul>
<li><a href="<?php setHome()?>/institution/values">Our Values</a></li>
<li><a class="fancybox_pdf" href="<?php setHome()?>/institution/team">Our Team</a></li>
</ul>
</li>
<li><a href="javascript:void(0);"><span>Our Work</span></a>
<ul>
<li ><a href="<?php setHome()?>/works/webdesign">Web Design</a>
<ul>
<li><a href="<?php setHome()?>/works/webdesign/posters">Posters</a></li>
<li><a href="<?php setHome()?>/works/webdesign/websites">Websites</a></li>
</ul>
</li>
<li ><a href="<?php setHome()?>/works/3d">3d Modeling</a>
<ul>
<li><a href="<?php setHome()?>/works/3d/blender">Blender</a></li>
<li><a href="<?php setHome()?>/works/3d/studiomax">3d studio max</a></li>
</ul>
</li>
<li ><a href="<?php setHome()?>/works/video">Video</a>
<ul>
<li><a href="<?php setHome()?>/works/video/premiere">Premiere</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="javascript:void(0);"><span>Contacts</span></a>
<ul>
<li><a href="<?php setHome()?>/contacts/north">North Seaat</a></li>
<li><a href="<?php setHome()?>/contacts/south">South Seat</a></li>
</ul>
</li>
</ul>
<select id="select">
<option value="http://jsfiddle.net/harshdand/c42ovrt5">Our...
CSS
#menu-container{
width:100%;
height:72px;
float:left;
float:left;
background:green;
border-bottom: 3px solid #ccc;
}
#menu{
width:300px;
height:auto;
margin:0 auto 0 auto;
}
.menu_desktop{display:none;}
#select{margin-top:20px;}
JavaScript
document.getElementById('select').onchange = function(){
window.location.href = this.value;
}