title: localScroll jquery plugin issue
body: <p>I have got some tutorials on localScroll jquery plugin for smooth scrolling to a specific anchor tag in a page. The example is showing that if a link is clicked, page moves to tag. I want to achieve it differently. I want to scroll inside a div by changing the value of drop down. But it is not working. The entire code is given below.</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
      &lt;title&gt;jQuery scrollTo &amp; localscroll Demo&lt;/title&gt;
      &lt;!-- Load jQuery --&gt;
      &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"&gt;&lt;/script&gt;
      &lt;!-- Load ScrollTo --&gt;
      &lt;script src="http://flesler-plugins.googlecode.com/files/jquery.scrollTo-1.4.2-min.js"&gt;&lt;/script&gt;
      &lt;!-- Load LocalScroll --&gt;
      &lt;script src="http://flesler-plugins.googlecode.com/files/jquery.localscroll-1.2.7-min.js"&gt;&lt;/script&gt;
      &lt;!-- Some CSS --&gt;
      &lt;style type="text/css"&gt;
      /* CSS for the big boxes */
      .box {
          width: 300px;
          height: 300px;
          color: #fff;
          padding: 10px;
          margin: 100px 0 0 0;
      }
      #box1 {
          margin: 300px 0 0 0;
          background: blue;
      }
  
      #box2 {
          background: red;
      }
  
      #box3 {
          background: green;
      }
  
      #box4 {
          background: gray;
      }
  
  
      /* CSS for the small boxes that will scroll inside a div */
  
      #small-box-container {
          border: 1px solid black;
          padding: 20px;
          width: 300px;
          height: 200px;
  
          overflow: scroll;
      }
  
      .small-box {
  
          color: #fff;
          padding: 10px;
  
          width: 200px;
          height: 200px;
          margin: 0 0 50px 0;
      }
  
      #small-box1 {
          background: blue;
      }
  
      #small-box2 {
          background: red;
      }
  
      #small-box3 {
          background: green;
      }
  
      &lt;/style&gt;
  
      &lt;!-- javascript that will initiate jQuery and the LocalScroll plugin --&gt;
  &lt;script&gt;
    $(document).ready(function()
    {
        $('#day_select').change(function(){
            jump = this.value;                         
            $(jump).localScroll({
               target:'#small-box-container'
            });
        });
    });
  &lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;h3&gt;Scroll inside a div&lt;/h3&gt;
  
  &lt;div id="small-box-links"&gt;
    &lt;select id="day_select" size="1"&gt;
        &lt;option value="#small-box1"&gt;Link to small-box #1&lt;/option&gt;
        &lt;option value="#small-box2"&gt;Link to small-box #2&lt;/option&gt;
        &lt;option value="#small-box3"&gt;Link to small-box #3&lt;/option&gt;
    &lt;/select&gt;
  &lt;/div&gt;
  
  &lt;div id="small-box-container"&gt;
    &lt;div id="small-box1" class="small-box"&gt;Small-Box #1&lt;/div&gt;
    &lt;div id="small-box2" class="small-box"&gt;Small-Box #2&lt;/div&gt;
    &lt;div id="small-box3" class="small-box"&gt;Small-Box #3&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Any suggestions from the expert is highly appreciated. Thanks in advance.</p>