Question

我想调整右边元素“w”并调整中间元素的大小，这样两者的总宽度不会改变。我试图做的是在调整大小时在中间元素上添加/减去px。 info div在调整大小时显示正确的中间宽度，但可见的中间div的宽度与info div中显示的不同。相同的方法工作宽度调整大小“e”，但不是“w”。这是小提琴：http://jsfiddle.net/perea1/2j6L9/9/ 顺便说一句，我不喜欢使用resizeReverse插件。

.wrapper {
    width:300px;
    height:80px;
    background-color:#ccc;
     }
.left {
    float:left;
    width:100px;
    height:80px;
    background-color:yellow;
     }
.middle {
    float:left;
    width:100px;
    height:80px;
    background-color:green;
     }
.right {
    float:left;
    width:100px;
    height:80px;
        background-color:blue;
     }

<div class="wrapper">
    <div class="left"></div>   
    <div class="middle"></div>   
    <div class="right"></div>   
    </div>  
    <div class="info1"></div> 
    <div class="info2"></div> 

$(".right").resizable({
    autoHide: true,
    handles: "w",
    start: function (event, ui) {
        startw = $(this).width();
        midw = $(".middle").width();
    },
    resize: function (event, ui) {
        var resw = $(this).width();
        var neww = startw - resw;

        $(".middle").css("width", ui.originalSize.width + neww);
        $(".info1").text(resw);
        $(".info2").text(midw + neww);

    }
});

Answer 1

我在右边的元素上添加了位置0，它是如何工作的

$(this).css("left","0");

jquery可调整大小不正确的宽度

1 个答案: