2016-11-17 462 views
0

我正在嘗試將完美滾動條插件與Select2集成。向下滾動時,滾動條走得很遠。看來PS不正確地計算select2選項容器的高度。有人可以幫忙嗎?Select2中完美的滾動條。容器高度錯誤

下面是一個簡單的HTML片段:

<select class="select2-example"> 
    <option value="1">Item 1</option> 
    <option value="2">Item 2</option> 
    <option value="3">Item 3</option> 
    <option value="4">Item 4</option> 
    <option value="5">Item 5</option> 
    <option value="6">Item 6</option> 
    <option value="7">Item 7</option> 
    <option value="8">Item 8</option> 
    <option value="9">Item 9</option> 
    <option value="10">Item 10</option> 
    <option value="11">Item 11</option> 
    <option value="12">Item 12</option> 
</select> 

JS:

$(document).ready(function() { 
    $(".select2-example").select2(); 
    $('.select2-example').on("select2:open", function() { 
    $('.select2-results__options').perfectScrollbar(); 
    }); 
}); 

這裏是jsfiddle

回答

0

perfect-scrollbar's documentation

以下要求應該滿足:

  1. 容器必須有一個位置風格**

所以,你需要的一切就是位置樣式到容器:

.select2-results__options { 
    position: relative; 
} 

更新fiddle