How to disable background scrolling while modal dialog is open?

On Sharepoint 2010, when a dialog pops up, users are able to scroll in the background. This affects the user experience, particulary on devices. I have researched a lot into solving this, and obviously the answer is in changing the body overflow to hidden and then back again.

The code below works:

$(function(){
ExecuteOrDelayUntilScriptLoaded(OverrideModal,”SP.js”); });

function OverrideModal(){
SP.UI.ModalDialog.showModalDialog_old = SP.UI.ModalDialog.showModalDialog;
SP.UI.ModalDialog.showModalDialog = function(options){
options.autoSize = true;
options.dialogReturnValueCallback = function(dialogResult){
SP.UI.ModalDialog.RefreshPage(dialogResult);
$(“body”).css(“overflow”,”auto”);
};
$(“body”).css(“overflow”,”hidden”);
SP.UI.ModalDialog.showModalDialog_old(options);
};

$(“a[id^=DlgClosed]”).click(function(){
$(“body”).css(“overflow”,”auto”);
});
}

However, I have noticed that when you open a modal dialog and content needs to load, the waitscreen loading box will not go away – leaving the user unable to access the modal dialog.

Any idea why this might be? Incidentally, this is for all modal dialogs within Sharepoint, not just for a custom one.

Thanks

=================

=================

=================