6

ユーザーが HTML ページを作成して、別のサイトで保存および共有できるサイトを構築しています。ページ要素のサイズ変更とドラッグができるようにしたい。jQueryを使用してこれを行うことができますが、それを保存して、ページが他の場所で表示されたときに同じように見えるようにする方法がわかりません。

ページ情報を保存する方法はまだ決めていませんが、データベース内の各要素をその絶対位置とその内容と共に保存できると考えています。それは良い計画のように聞こえますか？

もしそうなら、保存できるように div の位置を php に渡すにはどうすればよいですか?

ありがとう。

4

2 に答える 2

14

JQueryUI Resizable には、resize使用できるというイベントがあります。

var resposition = '';

$('#divresize').resizable({
   //options...
   resize: function(event,ui){
      resposition = ui.position;
   }
});

JQueryUI Draggable とそのイベントでも同じことが起こりますdrag。

var dragposition = '';

$('#divdrag').draggable({
   // other options...
   drag: function(event,ui){
      dragposition = ui.position;
   }
});

respositiondragposition配列になります。ここで動作することがわかります: http://jsbin.com/uvuzi5

編集：フォームを使用して、非表示の入力にdragposition保存できますresposition

var inputres = '<input type="hidden" id="resposition" value="'+resposition.left+','+resposition.top+'"/>'
$('#myform').append(inputres);
var inputdrag = '<input type="hidden" id="dragposition" value="'+dragposition.left+','+dragposition.top+'"/>'
$('#myform').append(inputdrag);

そして、フォームを処理するためにPHPファイルで：

$dragposition = $_GET['dragposition'];
$resposition = $_GET['resposition'];
$dragposition = explode(',',$dragposition);
$resposition = explode(',',$resposition);

最後に、両方の変数は、top および left 属性を持つ配列である必要があります。

$dragposition => [top,left] attributes from draggable
$resposition => [top,left] attributes from resizable
于 2011-03-14T21:37:31.160 に答える