jquery autocomplete scroll issue, disable body scrolling

Question

I added jquery autocomplete to my page but there is problem.

When I type something and complete examples popup how can I disable page scroll and only enable examples scroll?

This is jquery plugin code that I use

/*! jQuery UI - v1.8.24 - 2012-09-28
* https://github.com/jquery/jquery-ui
* Includes: jquery.ui.core.css, jquery.ui.accordion.css, jquery.ui.autocomplete.css, jquery.ui.button.css, jquery.ui.datepicker.css, jquery.ui.dialog.css, jquery.ui.progressbar.css, jquery.ui.resizable.css, jquery.ui.selectable.css, jquery.ui.slider.css, jquery.ui.tabs.css, jquery.ui.theme.css

Here is the screenshot: http://prntscr.com/2ud179

Answer 1

I would do

$('#autocomplete-field').autocomplete({
    source: /* ... */,
    open: function (event, ui) {
        $("html, body").css({overflow: 'hidden'});
    },
    close: function () {
        $("html, body").css({overflow: 'inherit'});
    }
});