jQuery ui对话框拖动问题

Question

我为我们的一个产品使用了jQuery ui(jquery-ui-1.10.3)对话框插件,并发现了一个可能的"问题":当托管页面很小或托管页面的当前视图滚动到顶部时,拖动打开的对话框的行为与预期的一样.当在大页面中托管对话框时,问题开始显现,该页面滚动到不在顶部的某个位置,在这种情况下,对话框在拖动期间开始跳转.它发生在IE 9和最新的Firefox(21.0)上.

该页面是动态生成的,复杂且必须很长.我不熟悉小提琴,但似乎没有我可以使用的jQuery-ui lib选项的选项.

更具体地说,我发现如果我将主机页面100px缩小(所以主机页面的前100px是'feed'进入浏览器窗口的顶部边框)然后当我拖动对话框而不是它跟随鼠标时,它向下跳100px,使其超出鼠标捕获范围.

该对话框初始化为

$(element).dialog({ 
    autoOpen: false, width: 950, height: 820, 
    modal: false, resizable: true, draggable: true
});

我的问题是:1)其他人是否有同样的问题？2)如果是,这是设置问题还是错误.

这里有专家可以帮我吗？

Answer 1

我以前有同样的问题,页面上的内容是自动生成的.这很长.

html, body {position: relative} 解决了这个问题.

Answer 2

好的,我发现这是jQuery-ui 1.10.3的错误,请看这里:

只有在使用UI 1.10.3并且当Firefox,Opera,IE8中的滚动条不在最顶端时才会出现这种情况.

在Chrome中工作正常,在其他浏览器上也是1.10.2.

UI对话框演示页面也有这个错误:

向下拖动对话框直到出现滚动条向下滚动再向下拖动对话框.对话框随着偏移而下降

Answer 3

我修复此错误的解决方案类似于Dado,但使用拖动事件:

        $(element).dialog({
            draggable: true,
            drag: function(event, ui) {
                var fixPix = $(document).scrollTop();
                iObj = ui.position;
                iObj.top = iObj.top - fixPix;
                $(this).closest(".ui-dialog").css("top", iObj.top + "px");
            }
        });

我的版本:jQuery UI - v1.10.3 - 2013-10-10