Select2 + custom scrollbar

Question

I'm trying to connect some custom scrollbars with Select2 4.0. I found some old topics here on stackoverflow, but the solutions (with select2 3.4 ie) seems to be outdated.

I tried: jquery.scrollpane and jquery.nicescroll. Both scrollbars don't work with Select2 4.0. Or maybe I did something wrong?

scrollpane solution (when used, "No results found" error occures)

 $(function() { $('.select2-with-scroll').jScrollPane(); $w.on('resize', function() { $('.select2-with-scroll').jScrollPane(); }); }); 

 <select class="select2-with-scroll"> <option value=""></option> <option value="50">50</option> <option value="55">55</option> <option value="60">60</option> <option value="65">65</option> <option value="70">70</option> <option value="75">75</option> <option value="80">80</option> <option value="85">85</option> <option value="90">90</option> <option value="95">95</option> <option value="100">100</option> </select> 

nicescroll solution (absolutely no effects, HTML as above)

 $(document).ready( function() { $("select2-with-scroll").niceScroll(); } ); 

Is there any other custom scrollbars which I can use with Select2 4.0? Or maybe it's possible to connect nicescroll or scrollpane with Select2? Any help will be appreciated.

Answer 1

With select2 v4.0 + nicescroll v3.6.6 try to make something like this

$('select').select2()
.on("select2:open", function () {
    $('.select2-results__options').niceScroll();
});