Ver Mensaje Individual
  #1 (permalink)  
Antiguo 20/09/2010, 14:17
popeosorio
 
Fecha de Ingreso: noviembre-2008
Mensajes: 65
Antigüedad: 15 años, 5 meses
Puntos: 1
Drag and drop

Encontre un ejemplo de drag and drop en el que solo es copiar y pegar un codigo simple:

Pegar en head:

Código PHP:
<style>
<!--
.
dragme{position:relative;}
-->
</
style>
<
script language="JavaScript1.2">
<!--

var 
ie=document.all;
var 
nn6=document.getElementById&&!document.all;

var 
isdrag=false;
var 
x,y;
var 
dobj;

function 
movemouse(e)
{
  if (
isdrag)
  {
    
dobj.style.left nn6 tx e.clientX tx event.clientX x;
    
dobj.style.top  nn6 ty e.clientY ty event.clientY y;
    return 
false;
  }
}

function 
selectmouse(e
{
  var 
fobj       nn6 e.target event.srcElement;
  var 
topelement nn6 "HTML" "BODY";

  while (
fobj.tagName != topelement && fobj.className != "dragme")
  {
    
fobj nn6 fobj.parentNode fobj.parentElement;
  }

  if (
fobj.className=="dragme")
  {
    
isdrag true;
    
dobj fobj;
    
tx parseInt(dobj.style.left+0);
    
ty parseInt(dobj.style.top+0);
    
nn6 e.clientX event.clientX;
    
nn6 e.clientY event.clientY;
    
document.onmousemove=movemouse;
    return 
false;
  }
}

document.onmousedown=selectmouse;
document.onmouseup=new Function("isdrag=false");

//-->
</script> 
Para la imagen:
Código:
<Img src = "images / AIM_smiley.gif" class = "dragme">
El ejemplo aqui:
http://elouai.com/javascript-drag-and-drop.php

pero tienen alguna idea de como crear una zona drageable, como una tabla en la que solo los elementos puedan ser puestos unicamente ahi.

Gracias de antemano