Element Position Before Dragging - Droppable - jQuery

Asked

Viewed 256 times

0

I am making a game and need to get the position of an element before dragging it. I am using the function Droppable jQuery UI.

jQuery

$("div.cesto").off().droppable({
    accept : "span.piece",
    // Quando coloca o mouse em cima do cesto
    over : function(){
        $(this).addClass("amp");
        media.replay("boeing-02");
        media.play("boeing-02");
    },
    // Quando sai com o mouse de cima do cesto
    out : function(){
        $(this).removeClass("amp");
    },
    drop : function(event, ui){
        var cesto = $(this);

        // Posições atual do elemento
        var positionTopPiece  = ui.position.top;
        var positionLeftPiece = ui.position.left;

In the last two lines of the code note that I am taking the current position of the element. That is, I click on the element, drag and drop and give me the position.

But that’s not what I want. I want you to click on the element, before dragging it, save your position TOP and LEFT to later use in a function.

That is, the element will return to its origin position depending on a result.

I’m in the documentation of Droppable - http://api.jqueryui.com/droppable/

But I can’t find a function to do what I need.


position

Type: Object

Current CSS position of the draggable helper as { top, left } Object.

offset

Type: Object

Current offset position of the draggable helper as { top, left } Object.

1 answer

0


I was able to solve it using the callback active.

    // Ao clicar sobre o elemento 
    activate : function(event, ui){
        positionTopPiece  = ui.draggable.css("top"); // Posição de Origem - Para caso errar, voltar
        positionLeftPiece = ui.draggable.css("left"); // Posição de Origem - Para caso errar, voltar
    },

I created two global variables. positionTopPieceand positionLeftPiece.

I took the positions top and left and then use in a function to return the item to its origin.

Thank you.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.