2

我正在使用 jQuery 中的 resizable() 函数来调整 div 的大小，该 div 包含一个 iframe，其宽度和高度设置为 100%（以填充 div 的空间）。我遇到的问题是，当我在任一方向向内调整大小（缩小 div）时 - 如果我将鼠标移动得太快，它会失去抓取（使 div 固定）并且不再调整大小，直到我将鼠标重新对准角落。

扩展 div 时效果很好，我可以通过快速移动鼠标来做到这一点，但是必须小心移动 div 以确保它不会卡住，这很烦人。

有任何想法吗？

非常感谢。

编辑：

我已将示例上传到我的网站： http ://stefandunn.co.uk/concepts/drag&drop/

只需单击“网页”小部件并调整其大小。

4

2 回答 2

8

过去我有同样的问题，我发现的解决方案/黑客是这样的：

$("yourObjectToResize").resizable({
    //containment: 'parent',
    minWidth: 400,
    minHeight: 200,
    start: function () {
        $(".widget_box").each(function (index, element) {
            var d = $('<div class="iframeCover" style="zindex:99;position:absolute;width:100%;top:0px;left:0px;height:' + $(element).height() + 'px"></div>');
            $(element).append(d);
        });
    },
    stop: function () {
        $('.iframeCover').remove();
    }
});
于 2012-08-23T14:51:50.647 回答
0

没有一个活生生的例子很难说，但我认为这是因为 iframe 本身中的其他悬停/鼠标事件。调整大小时，您可以尝试查看以下选项：

.preventDefault();
.stopPropagation();
.stopImmediatePropagation();

好的，快速浏览一下，我认为如果您使用start:事件 on .resizeable()，将网页 div 的 z-index 设置在 iframe 的 z-index 上方，然后将其放回stop:事件下方，您应该会很好。

嗯，我认为 z-index 不起作用，请在 .resizable() 的启动事件中尝试上面的选项；

如果以后有时间，我会尝试设置适当的测试并为您寻找。

于 2012-08-23T14:51:37.527 回答