jquery - jQuery UI のサイズ変更可能なサイズへのスナップ

Question

サイズ変更可能な左側のナビゲーションがあります。デフォルトの幅は 200 で、リサイズをその幅に合わせたいと思います。現在、このif句は正常に機能していますが、プログラムでその幅にスナップする方法がわかりません。

resize: function (event, ui) {
    if(Math.abs(200 - ui.size.width) <= 20){
        // snap to 200 width
    }
}

誰かがここで私を助けることができれば素晴らしいでしょう:)

Answer 1

わかりました。要素の幅を 200 に設定するだけです。許容範囲は 15 ピクセルなので、要素が 185 ～ 215 ピクセルの場合は 200 ピクセルにスナップされます。

$("#left").resizable({
minWidth: 60,
handles: "e",
resize: function (event, ui) {
    if(Math.abs(200 - ui.size.width) <= 15){
        $("#left").css("width", 200);
    }
}

Answer 2

そこにあるように：http://jqueryui.com/resizable/#max-minあなたはこれを使うことができます：

$(function() {
    $( "#left" ).resizable({
      maxWidth: 200,
      minWidth: 20
    });
});

Answer 3

のようなものはどう$(ui).width(200);ですか？あなたのコードに何が入っているのか私にはわからないので、セレクターuiを調整する必要があるかもしれないことに注意してください。jQuery

Answer 4

「スナップ」がどちらかの側から発生するように、範囲内の幅をチェックします。

resize: function (event, ui) {
    if(ui.size.width >= 180 && ui.size.width <= 220){
        // snap to 200 width
    }
}