Autocomplete jquery UI plugin with custom scrollbars

Question

did someone try to make custom scrollbars for jquery UI autocomplete widget? I'm trying to use jScrollPane jquery component in combination with autocomplete widget, but so far didn't have any success. If someone knows about some jquery autocomplete component with custom scrollbars, or knows how to change jquery ui autocomplete widget to support jscrollpane component, I would appreciate it.

Answer 1

• DEMO: http://so.lucafilosofi.com/autocomplete-jquery-ui-plugin-with-custom-scrollbars

• UPDATED: 22/09/2015 updated to all latest versions: jquery 1.11.3, jquery-ui 1.11.4, jScrollPane 2.0.22

....
open: function() {
  $('.ui-autocomplete').width($(this).width());
  if (undefined !== _jScrollPane) {
    _jScrollPaneAPI.destroy();
  }
  $('.ui-autocomplete > li')
    .wrapAll($('<div class="scroll-panel"></div>')
      .width($(this).width())
      .height(_jSheight));
  _jScrollPane = $('.scroll-panel').jScrollPane(settings),
  _jScrollPaneAPI = _jScrollPane.data('jsp');
},
close: function(event, ui) {
  _jScrollPaneAPI.destroy();
  _jScrollPane = undefined;
},
....

Please refer to the demo source code for full working code... thanks.