www.webdeveloper.com
Results 1 to 5 of 5

Thread: forms list as a mobile drop menu not working

  1. #1
    Join Date
    Jul 2012
    Location
    Vantaa, Finland
    Posts
    125

    forms list as a mobile drop menu not working

    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:

    HTML 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">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.

  2. #2
    Join Date
    Oct 2012
    Posts
    13
    HTML 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">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:
    HTML 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">Welcome</option>
        <option value="author.html">About the author</option>
        </select>
        </form>
       </div>

  3. #3
    Join Date
    Jul 2012
    Location
    Vantaa, Finland
    Posts
    125
    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:
    HTML 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?

  4. #4
    Join Date
    Oct 2012
    Posts
    13
    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

  5. #5
    Join Date
    Jul 2012
    Location
    Vantaa, Finland
    Posts
    125
    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.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles