jQuery UI可调整大小 - 与网格同步

Question

我有两个可调整大小的元素,我需要它们调整大小同步维护网格.似乎这两个选项不能一起工作.有任何想法吗？

演示:http://jsfiddle.net/CbYtT/2/ (尝试水平调整大小)

$(function() {

    $( "#this" ).resizable({
        alsoResize: "#that", 
        grid: 100

    });

    $( "#that" ).resizable({
        alsoResize: "#this", 
        grid: 100
    });

});

Answer 1

它不漂亮,但它的工作原理.

    $( "#this" ).resizable({
        handles: "e",
        resize: function(event, ui) {
            $( "#that" ).width($(this).width());
            $( "#that" ).height($(this).height());
        },
        stop: function(event, ui) {
            $( "#that" ).width($(this).width());
            $( "#that" ).height($(this).height());
        },
        grid: 100
    });

    $( "#that" ).resizable({
        handles: "e",
        resize: function(event, ui) {
            $( "#this" ).width($(this).width());
            $( "#this" ).height($(this).height());
        },
        stop: function(event, ui) {
            $( "#this" ).width($(this).width());
            $( "#this" ).height($(this).height());
        },
        grid: 100
    });

JS小提琴的工作版本

http://jsfiddle.net/Robodude/CbYtT/3/