Danilo Trindade - Javascript, Php e o que der na telha…

Drag’n Drop v.1

23/07/2008 - 23:18 1 comentário

Saudações tricolores!

Vou disponibilizar hoje uma classe que fiz de Drag’n Drop. É muito fácil utilizá-la, porém estou com outras idéias para melhorar e deixar sua implementção mais simples ainda.

Para começar os OBJETOS (DIV, SPAN, ETC) tem que ter o position:absolute, depois siga o exemplo abaixo:

Baixe o arquivo: Drag

<script type="text/javascript" src="drag.js">< !–-//-–></script>
<script type="text/javascript">
    objDrag = [];

    onselectstart = function() { return false; }
    ondragstart = function() { return false; }

    objDrag['ID1'] = new Drag(); // Para cada obj que deve ser "dragavel"
    objDrag['ID2'] = new Drag();
</script>
<div id="ID1" onmousedown="objDrag[this.id].definirLayer(this); objDrag[this.id].ligarDrag(event);" onmouseup="objDrag[this.id].desligarDrag();">.</div>
<div id="ID2" onmousedown="objDrag[this.id].definirLayer(this); objDrag[this.id].ligarDrag(event);" onmouseup="objDrag[this.id].desligarDrag();">.</div>

Pronto é isso que precisa fazer para ter objetos com Dran’n Drop.

Obs.: Os div’s acima estão sem conteúdo/css sendo apenas para ilustrar os objetos, use blocos com conteúdos e formatados.

Abs,
Chapoo!

Autor: Chapolin - Categoria(s): Javascript, Orientação a objetos Tags: Classes, Javascript, Objetos