Drag and Drop

[Baia]

A ideia é arrastar e colocar objectos numa DIV

neste momento clico num botão e os objectos são colocados na Div, onde depois os arrasto e coloco na disposição que quero, como na imagem abaixo

A ideia é ter os objectos ao lado e ir arrastando os que quero para o lado as vezes que quiser como na figura abaixo

Alguém me consegue dar algumas luzes ou indicar um artigo que trate deste tipo de situação, ou seja, arrastar de um lado para o outro as vezes que sejam necessárias?

Obrigado

[bioshock]

Criei-te aqui uma brincadeira. http://jsfiddle.net/772wrnnL/

Pontos fulcrais do código:

1) É criada uma função para que, sempre que seja adicionado um objecto ao container, o possas mover.

$.fn.isDraggie = function(){
this.draggable({containment: $("#container")});
}

2) A condição de verificação se tem ou não a classe dropped precavê que possas criar novos objectos a partir dos objectos dentro do container.

if($clone.hasClass("dropped") == false){

}

3) O index do objecto que é arrastado é sobreposto ao container bem como é criado apenas e só um clone desse mesmo objecto de forma a não eliminar o original.

revert: "invalid", // Previne que arrastes o objecto para fora do container
helper: 'clone',
zIndex: 100,

Por este conjunto de código, tens uma base por onde te guiares.

[Baia]

obrigado bioshock, é isso,

mas só uma coisa, ao arrastar para o container ele coloca os novos itens sempre por baixo do que foi colocado anteriormente, não coloca sempre no canto superior esquerdo, como é que se pode resolver isso?

[bioshock]

Procuraste no google antes de me perguntar?

Antes de mais as documentações que irás precisar daqui para a frente de forma a colocares tudo a funcionar como pretendes são as seguintes:

Draggable Documentation

Droppable Documentation

Resizable Documentation

Se queres que apareça sempre em primeiro lugar, só tens de trocar o trecho de código $(this).append($clone); para $(this).prepend($clone);.

Desta forma quando arrastas o objecto este é colocado em primeiro lugar (independentemente da quantidade de objectos que já tenhas no container).