可重新设置:调整元素的大小超出屏幕末端

Question

我正在使用jQuery UI调整元素大小。我的元素应该可以重新解析至例如宽度。1200px或1600px（用户喜欢）。但是，当这个元素之前有一个元素（我水平安排了所有元素），如果鼠标光标到达屏幕的末端，则调整大小的操作会停止。

您可以在这里进行测试：http：//gopeter.de/clients/dustin/

最合适的盒子可以重新算起。

有人有什么想法我如何防止这种情况？到达末端时，我应该检查光标位置并扩展元素吗？还是还有其他技术？

Answer 1

也许您可以调整身体大小并滚动以进行连续调整：

var body = $('body');
$('#resize').resizable({
    handles: "e,s,se",
    resize: function (event, ui) {
        var width = body.width(),
            diff = width - (width - (this.offsetLeft + this.offsetWidth));
        body.width(diff).scrollLeft(diff);
    }
});

或（较少的jQuery）

$('#resize').resizable({
    handles: "e,s,se",
    resize: function (event, ui) {
        var width = document.body.clientWidth,
            diff = width - (width - (this.offsetLeft + this.offsetWidth));
        document.body.style.width = diff + 'px';
        document.body.scrollLeft = diff;
    }
});

这是相关的小提琴：http：//jsfiddle.net/jeff_mccoy/upmnq/2/

请注意，您只需调整每个x数量的像素（！diff％3）即可加快速度，例如，调整大小也有点干。

Answer 2

最好将调整大小的手柄放在左侧。