Question

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

$( "div" ).resizable();

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

我只想在y轴的一个方向调整大小
当我滚动内部div时，调整大小处理程序图标（位于角落右下方）不应滚动内容
滚动内部div时，如果所有内容都可见，则滚动条应该消失，

如何使用jquery ui resizable，或者除此之外还有任何可以执行此任务的插件。

小提琴：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

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

1 个答案: