クッキーの位置とサイズを記憶してください

Question

私は何をするべきか分かりません。助けてください。

私は、ページ上にドラッグ可能な拡大縮小可能なアイテムを含むウェブサイトを構築しました。あなたは私がなるように行うには、サイトにはアイテムの位置や規模を覚えている必要なもの http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js

...それからJavaスクリプトを使用しています...私はここに何をやったか http://www.hagueandhague.co.uk/test/hagueandhague/httpdocs/index.html

を見ることができます訪問者がサイトに戻ると、アイテムはどこに残っていますか？

私は、この情報をクッキーに保存することは可能だと思いますが、それをどうやって行うのか分かりません。

どんな助けも素晴らしいでしょうが、それが英国人/平凡人の場合はさらに優れています。

ありがとうございます。

James。

Answer 1

「layman」という用語では、Draggableプラグインのstopコールバックを使用して要素の位置を取得し、jQuery Cookieプラグインを使用してクッキーに保存します。ユーザーが戻ると、Cookieを読み込んで要素の位置を変更します。再位置に

$(".selector").draggable({ 
    stop: function(event, ui) { 
     $.cookie("elementIDCookie", ui.position); 
    } 
}); 

要素ときに、ユーザーが戻る：

$(".select").css({ "left" : $.cookie("elementIDCookie").left, "top" : $.cookie("elementIDCookie").top }); 

さらに詳しい情報：

http://jqueryui.com/demos/draggable/

https://github.com/carhartl/jquery-cookie

Answer 2

<script> 
    $(document).ready(function(){ 
     $('.dragboard').draggable({ 
      stop: function(event, ui) { 
       $.cookie('elementLeft', ui.position.left); 
       $.cookie('elementTop', ui.position.top); 
      } 
     }); 
     $('.dragboard').css({left : parseInt($.cookie('elementLeft')), top : parseInt($.cookie('elementTop'))}); 
    }); 
    </script> 

Answer 3

のTh箱の外からまっすぐに働くでしょう - ＃ピック右はドラッグするdivです。

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

    $(function() { 
     $("#pick-right").draggable({ stop: function (event, ui) { 
      $.cookie("rcpos", window.JSON.stringify(ui.position)); 
     } 
     }); 
    });