0

HTMLドロップダウン構造があります。次のように：

 <div class="tl_l">
<div class="labeled"><label for="pers_il">İl</label></div>
<select id="ad_il" name="pers_il" class="">
<option>İstanbul</option>
<option>Ankara</option>
<option>Adana</option>
<option>Adıyaman</option>
<option>Aydın</option>
<option>Muğla</option>
<option>Eskişehir</option>
<option>Konya</option>
<option>Denizli</option>
<option>Bitlis</option>
<option>Yozgat</option>
<option>Antalya</option>
<option>Muğla</option>
</select>
</div>

そして、iカスタムドロップダウン用のJGDドロップダウンjqueryプラグインを使用します。しかし、私のリストは長すぎます。だから、私はこのリストにカスタムscollbarを追加したいと思います。Tiny Scrollbarをインストールし、HTMLを追加しました。CSS：

#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; }

JS：

<script type="text/javascript">
    $(document).ready(function(){

        $('#scrollbar1').tinyscrollbar();

    });
</script>

タグを開いた後にscrollbar1idを追加selectしますが、機能しません。Firebugを介してエラーをチェックしたところ、見つかりませんでした。構造でこのプラグインを使用するにはどうすればよいですか？

4

1 に答える 1

1

ブラウザの組み込みスクロールバーを有効にするには、コンテナの高さとオーバーフローの両方を指定していることを確認してください 




#scrollbar1 { 
  width: 520px; 
  clear: both; 
  margin: 20px 0 10px;
  height: 400px;
  overflow-y: auto;
}

于 2013-02-22T14:30:19.033 に答える