jQuery UI dialog: vertical scroll works not correct if dialog height more than window height

Question

Here is code:

<script type="text/javascript">
    $(function(){
        var dialogOptions = {
            title: "Header",
            autoOpen: false,
            modal: true,
            width: 400,
            height: 1000
        };
        $(".wnd").dialog(dialogOptions);
        $("#btn").click(function(){ $(".wnd").dialog("open"); });
    });
</script>

<style>
    .wnd {background:yellow;height:900px;width:300px;}
</style>

<div class="wnd"></div>
<button id="btn">click me</button>

When dialog is opened and it higher than main window there is a side slider and it doesn't slide down if you try to drag it with the help of mouse cursor (it seemes like locked).

But it slides fine when to put down button (arrow) on keyboard or scroll down with mouse wheel.

Here is demo on jsfiddle.

How to activate that side slider?

Thanks!

Answer 1

A clean solution would be like this one:

http://jsfiddle.net/4fc33/6/

What I'm doing is wraping the jQuery UI overlay create method to turn off the event that prevents scrolling to work correctly.