title: Custom scrollbar on dropdown menu
body: <p>I have a HTML dropdown structure. With the following:</p>
  
  <pre><code> &lt;div class="tl_l"&gt;
  &lt;div class="labeled"&gt;&lt;label for="pers_il"&gt;İl&lt;/label&gt;&lt;/div&gt;
  &lt;select id="ad_il" name="pers_il" class=""&gt;
  &lt;option&gt;İstanbul&lt;/option&gt;
  &lt;option&gt;Ankara&lt;/option&gt;
  &lt;option&gt;Adana&lt;/option&gt;
  &lt;option&gt;Adıyaman&lt;/option&gt;
  &lt;option&gt;Aydın&lt;/option&gt;
  &lt;option&gt;Muğla&lt;/option&gt;
  &lt;option&gt;Eskişehir&lt;/option&gt;
  &lt;option&gt;Konya&lt;/option&gt;
  &lt;option&gt;Denizli&lt;/option&gt;
  &lt;option&gt;Bitlis&lt;/option&gt;
  &lt;option&gt;Yozgat&lt;/option&gt;
  &lt;option&gt;Antalya&lt;/option&gt;
  &lt;option&gt;Muğla&lt;/option&gt;
  &lt;/select&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And use <a href="http://www.dev4press.com/jquery/jgd-dropdown/" rel="nofollow">JGD Dropdown</a> jquery plugin for i custom dropdown. But my list is too long. So, i want add custom scollbar on this list. Installed <a href="http://baijs.nl/tinyscrollbar/" rel="nofollow">Tiny Scrollbar</a> and add my HTML. CSS:</p>
  
  <pre><code>#scrollbar1 { width: 520px; clear: both; margin: 20px 0 10px; }
  #scrollbar1 .viewport { width: 500px; height: 200px; overflow: hidden; position: relative; }
  #scrollbar1 .overview { list-style: none; position: absolute; left: 0; top: 0; }
  #scrollbar1 .thumb .end,
  #scrollbar1 .thumb { background-color: #003D5D; }
  #scrollbar1 .scrollbar { position: relative; float: right; width: 15px; }
  #scrollbar1 .track { background-color: #D8EEFD; height: 100%; width:13px; position: relative; padding: 0 1px; }
  #scrollbar1 .thumb { height: 20px; width: 13px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
  #scrollbar1 .thumb .end { overflow: hidden; height: 5px; width: 13px; }
  #scrollbar1 .disable{ display: none; }
  .noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(document).ready(function(){
  
          $('#scrollbar1').tinyscrollbar();
  
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>And add scrollbar1 id after opening <code>select</code> tag but don't work. When checked any erros via Firebug, not found. How can i use this plugin on my structure?</p>