どのようにして、画面を終了することができますか？

Question

私は現在、見事に動作し、このコードを使用しています：

$(document).ready(function() { 
    if ($.cookie("cvispos") != undefined) { 
     var unwrapped = window.JSON.parse($.cookie("cvispos")); 
     var left = window.JSON.parse($.cookie("cvispos")).left; 
     var top = window.JSON.parse($.cookie("cvispos")).top; 
     $("#cguts").css("left", left + "px"); 
     $("#cguts").css("top", top + "px"); 
    } 
}); 

// Buncha cookie stuff and onclick trash... 

$("#cguts").draggable({ 
    stop: function (event, ui) { 
     $.cookie("cvispos", window.JSON.stringify(ui.position)); 
    } 

私が午前問題は、あなたがこれまで上下にボックスをドラッグした場合、あなたは能力をまったく必要とせずに画面をそれを移動することができるということですそれを元に戻す。視点の外に動かないようにする方法はありますか？私はスナップを使用しようとしましたが、動作させることができませんでした。私はポジショニングに最小/最大を設定することでそれを達成することができましたが、このコードで可能であると私に信じさせたリソースは見つかりませんでした。

Answer 1

ドラッグ可能なオブジェクトのcontainmentパラメータをwindowに設定して、表示範囲内に移動を制限することができます。

コードを最適化するには、JSONを一度デシリアライズしてから、両方ともcss()プロパティを1回の呼び出しで設定するだけです。試してみてください：

$(document).ready(function() { 
    if ($.cookie("cvispos") != undefined) { 
     var cookieData = JSON.parse($.cookie("cvispos")); 
     $("#cguts").css({ 
      left: cookieData.left + "px", 
      top: cookieData.top + "px" 
     }); 
    } 
}); 

// Buncha cookie stuff and onclick trash... 

$("#cguts").draggable({ 
    containment: 'window', 
    stop: function (event, ui) { 
     $.cookie("cvispos", JSON.stringify(ui.position)); 
    } 
});