[thelist] input type="image" vs. input type="button"

[jono at charlestonwebsolutions.com]

I would like to use a custom image for the button on the example form
below.  Using an image for the button breaks the form's functionality, but
I am not sure why?

This does not work:

<div id="form-wrap">
  <form name="example">
    <label for="topics">Select a topic:</label>
    <select name="topics">
      <option value="selected">Tell me more about...</option>
      <option value="http://www.page1.php">Page One</option>
      <option value="http://www.page2.php">Page Two</option>
      <option value="http://www.page3.php">Page Three</option>
      <option value="http://www.page4.php">Page Four</option>
    </select>
    <input type="image" src="button.gif"
onClick="location=document.example.topics.options[document.example.topics.selectedIndex].value;"
value="GO" />
  </form>
</div>



This Does Work:

<div id="form-wrap">
  <form name="example">
    <label for="topics">Select a topic:</label>
    <select name="topics">
      <option value="selected">Tell me more about...</option>
      <option value="http://www.page1.php">Page One</option>
      <option value="http://www.page2.php">Page Two</option>
      <option value="http://www.page3.php">Page Three</option>
      <option value="http://www.page4.php">Page Four</option>
    </select>
    <input type="button"
onClick="location=document.example.topics.options[document.example.topics.selectedIndex].value;"
value="GO" />
  </form>
</div>

What is it about custom images for form buttons that break the JavaScript
in the form?  Is there an alterantive approach to what I have above that
will work?

Thanks,

Jono