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>

并使用JGD Dropdown 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>

并在打开标签后添加 scrollbar1 idselect但不起作用。通过 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 回答