title: Anchor tag in Drop down
body: <p>I was researching how to create a drop down menu that once an option is selected, rather than jump to a new page, you scroll down the page via an anchor tag, but I can't quire figure it out.</p>
  
  <p>My logic so far is to set the dropdown to a variable.  Take that variable and onchange, compare it to it's current position and as long as the position isn't "0" try to make it follow the anchor link, just as if I was making it load a new page.  Can someone help me with what I'm missing?</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;select name="dropDown" id="dropDown"&gt;
  &lt;option value="one"&gt;&lt;a href="#heading1"&gt;one&lt;/a&gt;&lt;/option&gt;
  &lt;option value="two"&gt;&lt;a href="#heading2"&gt;two&lt;/option&gt;
  &lt;option value="three"&gt;three&lt;/option&gt;
  &lt;/select&gt;
  
  
  &lt;p id="heading1"&gt;&lt;a name="heading1"&gt;Heading one&lt;/a&gt;&lt;/p&gt;
  
  &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br    /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;    &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;    &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt; &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;&lt;br /&gt;
  
  &lt;p id="heading2"&gt;&lt;a name="heading2"&gt;Heading 2&lt;/a&gt;&lt;/p&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>var dropDownValue = document.getElementById("dropDown");
  
  dropDownValue.onchange = function()
  {
  if(this.selectedIndex !== 0)
  {
      window.location.href=this.value;
  }
  };
  </code></pre>