forms list as a mobile drop menu not working

[tony webb]

I am trying to make my website mobile friendly and am new to programming.

I thought that I would use a simple forms drop down menu for now and program a proper mobile menu later.
The menu isn't working properly. The selected option shows in the box and the screen refreshes but it doesn't change pages.

An example of the code that I use is:

<div id="drop-down">
      <form name="form">
         <SELECT name="guidelinks" onChange="window.location=document.form.guidelinks.options[document.form.guidelinks.selectedIndex].value">
    <option selected>Main Menu
    </option>
    <option value="index.html">Welcome</a></li>
    <option value="author.html">About the author</a></li>
    </select>
    </form>
   </div>

What do I need to do to get the list to work properly?
Thanks in advance.

[b073r]

<div id="drop-down">
      <form name="form">
         <SELECT name="guidelinks" onChange="window.location=document.form.guidelinks.options[document.form.guidelinks.selectedIndex].value">
    <option selected>Main Menu
    </option>
    <option value="index.html">Welcome</a></li>
    <option value="author.html">About the author</a></li>
    </select>
    </form>
   </div>

[/QUOTE]

Delete the closing <a> and <li> tags
it should look like that:

<div id="drop-down">
      <form name="form">
         <SELECT name="guidelinks" onChange="window.location=document.form.guidelinks.options[document.form.guidelinks.selectedIndex].value">
    <option selected>Main Menu
    </option>
    <option value="index.html">Welcome</option>
    <option value="author.html">About the author</option>
    </select>
    </form>
   </div>

[tony webb]

Thanks for your help and reply.
Unfortunately the drop down doesn't quiet work.
When I click on a link it defaults to sitemap.html (sitemap.html is always displayed)

Here is the code:

<div id="drop-down">
      <form name="form">
         <SELECT name="guidelinks" onChange="window.location=document.form.guidelinks.options[document.form.guidelinks.selectedIndex].value"> 
    <option selected>Main Menu
    </option>
    <option value="index.html">Home Page</option>
    <option value="small-studies.html">Free studies to download</option>
    <option value="small-books.html">Free books to download</option>
    <option value="author.html">About the author</option>
    <option value="http://what-do-christians-believe.co.uk/wp/category/food-for-thought-blogs/">Food for thought blog</option>
    <option value="contact.html">Contact Us</option>
    <option value="sitemap.html">Site map</option>
 </select>
    </form>
   </div>

Is there something else that I need to do?

[b073r]

Is your browser has a javascript turned on ? Because it is working on my computer without any issues. So maybe, if the sitemap is working there is a problem with how you named the links. I have entered to your web page and it is automaticlly redirect to /mob_devices, so it maybe because of that and also your links are like www.yourpage.com/wp/link.html . So try to input whole URL into the value. If it will not work contact via PM and I will try to help you

[tony webb]

Thanks for your reply.

It's late in the evening here so I will try what you have said tomorrow.

The mobile site you are being redirected too is a redirect that I have set up for the moment for people visiting my site and a javascript is doing the detect screen size and redirect.

The url where I am creating and testing a responsive design is http://what-do-christians-believe.co...st/author.html

I am testing this in the opera developer tester which is here : http://www.opera.com/developer/tools/mini/

I don't know if their tester has javascript disabled.