Проблемы с перетаскиванием JQuery с позицией, помощь!

Question

У меня возникли проблемы с перетаскиванием, перетаскиванием и позиционированием в jquery.

Вот что я пытаюсь достичь:

1. Вы перетащить клон DIV в другой DIV, который является «этап»
2. мне нужно положение клона и не оригинальный

Вот моя попытка до сих пор:

$(function() { 

$("#workspacemaster").droppable({ 
accept: '.draggable', 
drop: function(event, ui) 
{ 
} 

}); 

// Make images draggable. 
$("#draggable1").draggable({ 

    // Find original position of dragged image. 
    start: function(event, ui) { 

     // Show start dragged position of image. 
     var Startpos = $(this).position(); 
     $("div#start1").text("1 START: \nLeft: "+ Startpos.left + "\nTop: " + Startpos.top); 
    }, 
    cursor: 'move', 
    grid: [20, 20], 

    // Find position where image is dropped. 
    stop: function(event, ui) { 

     // Show dropped position. 
     var Stoppos = $(this).position(); 
     $("div#stop1").text("1 STOP: \nLeft: "+ Stoppos.left + "\nTop: " + Stoppos.top); 
    } 
}); 

}); 

Answer 1

Я думаю, вы должны осуществить это на Droppable вместо перетаскиваемом

$('#workspacemaster').droppable({ 
    accept: '.draggable', 
    drop: function(event, ui){ 
    //do something with $(ui.helper) or $(ui.draggable); 
    // this is scoped to the droppable 
    } 
}); 

Answer 2

Я сделал это для хрома, вы Ганна должны сделать это кросс-браузер:

$(".draggable").draggable({ 
    helper:"clone", 
    //this will take whatever css you have for .draggable and add opacity 
    opacity:0.7 
}); 


$('#workspacemaster').droppable(
    { 
    accept: ".pageControl", 
    drop: function(e,ui){ 
     $(this).append(
     $(ui.draggable).clone() 
     .css({ 
      position:"absolute", 
      top: e.clientY-e.offsetY, 
      left: e.clientX-e.offsetX 
     }) 
     .draggable({containment:"parent"}) 
    ); 
    } 
    } 
);