Creating drop menu navigation with <select>

15,709

Solution 1

Well you're not going to want to hear this, but it worked fine for me... i copied and pasted the code and tested it with Chrome and it went to your page just fine.

Solution 2

You might want to change onChange with window.location.href=this.value

So, the correct code is:

<select onChange="window.location.href=this.value">
    <option value="" selected="selected">Navigation</option>
    <option value="index.html">Home</option>
    <option value="detroitvideoproduction.html">Video Production</option>
    <option value="locationsounddetroit.html">Location Sound</option>
    <option value="videoeditingdetroit.html">Video Editing</option>
    <option value="custommotiongraphicsdetroit.html">Custom Graphics</option>
    <option value="demoreel.html">Demo Reel</option>
    <option value="http://www.youtube.com/user/VideoDetroitMI?ob=0">You Tube</option>
    <option value="http://vimeo.com/liveoutloudproductions">Vimeo</option>
    <option value="dslrrentalsdetroit.html">Camera Rental</option>
    <option value="lectrosonicsrentalsdetroit.html">Audio Rental</option>
    <option value="griprentalsdetroit.html">Grip Rental</option>
    <option value="camerasupportdetroit.html">Camera Support</option>
    <option value="about.html">About Us</option>
    <option value="contact.html">Contact</option>
</select>
Share:
15,709
timatgetdim
Author by

timatgetdim

I am a coder that works for a small company and im learning as i go. i have a decent grasp of css, but there are apparently alot of things i dont know. Im working on learning javascript but its not going as quickly as id like.

Updated on June 12, 2022

Comments

  • timatgetdim
    timatgetdim almost 2 years

    I've managed to make myself drop menu navigation with html <select>. I've encountered one problem, though.

    My external links aren't working. Namely Youtube.

    Here is the code:

       <select ONCHANGE="location = this.options[this.selectedIndex].value;">
    
       <option value="" selected="selected">Navigation</option>
    
       <option value="index.html">Home</option>
       <option value="detroitvideoproduction.html">Video Production</option>
       <option value="locationsounddetroit.html">Location Sound</option>
       <option value="videoeditingdetroit.html">Video Editing</option>
       <option value="custommotiongraphicsdetroit.html">Custom Graphics</option>
       <option value="demoreel.html">Demo Reel</option>
       <option value="http://www.youtube.com/user/VideoDetroitMI?ob=0">You Tube</option>
       <option value="http://vimeo.com/liveoutloudproductions">Vimeo</option>
       <option value="dslrrentalsdetroit.html">Camera Rental</option>
        <option value="lectrosonicsrentalsdetroit.html">Audio Rental</option>
        <option value="griprentalsdetroit.html">Grip Rental</option>
        <option value="camerasupportdetroit.html">Camera Support</option>
        <option value="about.html">About Us</option>
        <option value="contact.html">Contact</option>
                     </select>
    

    As you can see I have 2 external links. One to Vimeo, the other to Youtube. When you select Vimeo it works perfectly fine and takes you to the appropriate vimeo page, but when you select Youtube, it does nothing at all.

    I know the URL in the link is correct, I checked it before I posted this.

    Anybody know why Youtube wont work when Vimeo will?