スクロール後のJqueryサイズ変更可能な再配置ハンドル

Question

私はコンテナ内にhtmlテーブルを持っています。コンテナは高さがあり、そのオーバーフローyは私もjQueryのUIは、サイズ変更可能な使用してサイズ変更可能なコンテナをしたスクロールバー

.table-container { 
    height: 175px; 
    border-bottom: 2px solid #EEEEEE; 
    overflow-y: auto; 

} 

を作成するために、autoに設定します。

$(function() { 

$(".table-container").resizable({ handles: "s" }); 
}); 

残念ながら、スクロールバーを使用すると、サイズ変更可能なハンドルが移動します。私はそれが容器の底に留まることを望みます。ここはフィドルです。

https://jsfiddle.net/oyb3r6u8/1/enter link description here

Answer 1

あなたはドラッグの位置に基づいて、ドラッグ中にハンドルの位置を維持するためにjqueryのを使用することができます。私はあなたのコードを見ていたhttps://jsfiddle.net/k3e5ma2s/

$(function() { 

    $(".table-container").resizable({ handles: "s", resize: updateHandle }); 

    $(".table-container").scroll(function() { 
     updateHandle(); 
    }); 

    updateHandle(); 

}); 

function updateHandle() { 
    table = $('.table-container'); 
    var bottom = table.scrollTop() + table.outerHeight(true) - $('.ui-resizable-handle').outerHeight() - 5; 
    $('.ui-resizable-handle').css('top', bottom + 'px'); 
}