JQuery 可调整大小向一个方向移动，并删除滚动条

Question

我正在使用 jquery ressized 来调整 div 的大小

$( "div" ).resizable();

我有一个部分和一个 div ，其中包含可滚动内容。我面临几个问题。

1. 我只想在 y 轴一个方向上调整大小
2. 当我滚动内部 div 时，调整大小处理程序图标(位于右下角)不应随内容一起滚动
3. 滚动内部 div 时，如果所有内容都可见，则滚动条应该消失，

如何使用 jquery ui 可调整大小，或者除此之外还有其他插件可以完成这项工作。

fiddle :http://jsfiddle.net/k6r5P/

Answer 1

仅用于调整 y 轴上的 div 大小。如果您愿意，还可以删除 if 条件

尝试

$( ".contenteditable" ).resizable({
    create:function(event,ui){//for setting overflow

        if($(this)[0].scrollHeight > parseInt($(this).css('height'),10)){

            $('.contenteditable').css('overflow','auto');
        }
    },
    resize: function(event,ui){ //for restricting x-axis resize
        if(ui.size.width>250){
            ui.size.width = ui.originalSize.width;
        }
    }
});

要移动调整大小图标，请尝试

$( ".contenteditable" ).scroll(function(e){

    var newH = $(this).scrollTop() + parseInt($(this).css('height'),10);
    if(newH > $(this)[0].scrollHeight){
        newH = $(this)[0].scrollHeight;
    }
    $(this).css('height',newH+'px');
});

演示 here