blockUI not working with showModalDialog

Question

How do I get the blockUI overlay to display before the showModalDialog is called?

$("button").click(function(){
    $.blockUI({ message: '' });    
    window.showModalDialog("http://www.google.com");
    $.unblockUI();
}); 

http://jsfiddle.net/dTG82/

Answer 1

Because of the animation the $.blockUI function is not synchronous. You will have to wait for the animation to complete, or set fadeIn: 0.

$.blockUI({ message: '', fadeIn: 0 });

See working example

Answer 2

There could be so many answers to this question - but one obvious problem is that you call unblockUI immediately - and window.showModalDialog won't be a blocking method (as javascript doesn't support them) - it will return immediately.

You should call unblockUI in the close handler of the modal dialog.

All this of course assumes the methods are working as advertised in the first place.