0

我想调整右元素“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);

    }
});
4

1 回答 1

0

我在正确的元素上添加了位置 0,现在它可以工作了

$(this).css("left","0");  
于 2013-11-05T15:36:38.937 回答