Jquery Droppable Center Image After After Dropイベント

Question

こんにちは、私はjQueryを使って簡単な在庫を作成しています。今のところ、それはようなものだ：

$(document).ready(function() { 

$(".weapon, .helmet").draggable({ revert: "invalid", cursor: "move" }); 
$("#weapon_spot").droppable({accept: ".weapon"}); 
$("#helmet_spot").droppable({accept: ".helmet"}); 

// make inventory slots droppable as well 

$(".inv_slot").droppable({accept: ".weapon"}); 

}); 

私はjQueryのにちょっと新しいだといくつかの問題特定のdivの内側に整列する画像を設定することがあります。すべて（.weapon、.helmetなど）はdivです。それらの中には、画像が存在する可能性があります。 divは70x70で、画像もそのサイズです。

CSSが似ている：

.inv_slot, #weapon_spot, #helmet_spot { 
    width: 70px; 
    padding: 10px; 
    height: 70px; 
    margin: 10px; 
    border: 1px solid black; 
    float: left; 
    text-align: center; 
} 

とのdiv内の画像のようなある：

<div class='inv_slot'> 
    <img class='weapon' src= "..." /> 
</div> 

私の問題は、私は別のdivに画像をドロップすると、それはに整列していないということですdivの中心にはロックされておらず、内側に移動することができます。それは私が何とかDrag.Moveを使用することができるようだが、私はそれを説明するいくつかの良いリソースを見つけることができません。助けてもらえますか？ :)

編集：私はdroppablesにドロップコールバックを追加し、必要に応じてスタイルの変更を適用http://jsfiddle.net/kzuRn/2/

Answer 1

でデモを作成しました。今すぐアイテムはまだ絶対的に配置されているので、あなたのセンターCSSを認識しません。このような

何か：WRONG（下記参照）

drop: function(ev, ui) { 
     $(this).css({position: 'static'}) 
} 

---

私はthe fiddleを更新しました。私は前に間違っていた。 thisはドロップ可能で、ui.draggableはドラッグ可能です。