1

私はJQueryのドラッグアンドドロップを使用しています。ドラッグ可能な要素 (「要素」) を含む div を画面外に移動し、ドロップされた後、ドラッグ可能な要素を対応するスロットに配置したままにします。

すべてのドラッグ可能要素がそれぞれのスロットに配置されたら、クラスを追加してスロットを含む div を左に移動し、スロットに一致するようにドラッグ可能要素の位置を設定します。

$("#slots").addClass('left');
$( "#element1" ).position({my: "left top",at: "left top",of: "#slot_1"});
$( "#element2" ).position({my: "left top",at: "left top",of: "#slot_2"});
etc

これが完了したら、ドラッグした要素の上と、div の「要素」の上にもビデオを表示します。問題は、div の「要素」がまだスペースを占有していることです...そのため、画面外に移動したいと考えています。絶対配置でこれを実行しようとしましたが、ドラッグされた要素がスロットに設定されず、ビデオのスロットの真上に表示されます。

また、divの「スロット」に追加されるクラス「左」を次のように変更してみました。

#slots.left {
position:absolute;
top:400px;
left:30px;
}

ただし、これにより、ドラッグされた要素がスロットに配置されないという結果になります:

$("#slots").addClass('left');
$( "#element1" ).position({my: "left top",at: "left top",of: "#slot_1"});
$( "#element2" ).position({my: "left top",at: "left top",of: "#slot_2"});
etc

基本的には、ビデオとドラッグされた要素の間の垂直方向のスペースを減らしたいだけで、要素の div がそのスペースを占有することで何かを行います...

http://jsfiddle.net/4pBWT/でフィドルを参照してください。

4

1 に答える 1

1

ビデオを表示する前に、ドラッグした要素を含む親 div を非表示にすることができます。

$('#elements').hide();

更新されたフィドル

あなたのdivの調整を試みることができmargin-topます：#drag_drop

$('#drag_drop').css('margin-top', '-70px');

更新されたフィドル

于 2013-05-14T01:40:38.883 に答える