Pasar imagenes de una celda a otra...¿ COMO ?

makynero · #1 (**permalink**) 26/06/2007, 06:17

pasar imágenes de una celda de una tabla a otra celda de la otra tabla, simplemente arrastrandola.

Tengo este problema y no se como solucionarlo. No se que eventos tengo que utilizar, gracias.

derkenuke · #2 (**permalink**) 26/06/2007, 17:50

Lo primero que deberías implementar es un drag & drop de imagenes. En google habrá bastantes ejemplos de como hacerlo, se basa en los eventos onmousedown y onmouseup.

Luego ya se trataría de ver encima de qué celda está el ratón para llevar la imagen allí o allá, pero yo comenzaría por el drag & drop, que ya es bastante costoso de por sí.

Informanos del estado de tu investigación.

Un saludo.

zyon · #3 (**permalink**) 27/06/2007, 06:38

Que tal, io hice algo parecido con un calendario, solo que tenia problemas al querer arrastrar una fecha a otra celda del calendario, ya que por la capa que hay para simular el arrastre no podian generarse los eventos del mouse sobre la celda y no podia hacer que esa celda tubiese en verdad la nueva fecha que le arrastre, asi que tube que, al momento de seleccionar la fecha, hacer que la capa que simula ser la fecha se moviera a un lado del cursor, siguiendolo pero dejandolo libre para que me pudieran ejecutar los eventos que necesitaba del mause en las celdas del calendario...

derkenuke · #4 (**permalink**) 27/06/2007, 07:13

Creo que tu problema zyon, tiene que ver con el burbujeo de eventos, aunque yo diría que sí se puede hacer.

Leete El Modelo de Eventos del DOM de kusor para entender como fluyen los eventos a través de capas superpuestas. Lo que no te puedo prestar es ayuda, porque nunca he trabajado con ello (no se ha dado el caso). Pero tiene pinta de ser sencillo con las propiedades que pone. Lo único, quizás esté un poco desfasado porque incluye a NS y IE; tal vez habría que mirar como lo hace FF.

Un saludo.

zyon · #5 (**permalink**) 28/06/2007, 08:47

Gracias por la liga, en cuanto retome ese tema lo checare, Gracias!!!

MaBoRaK · #6 (**permalink**) 28/06/2007, 09:45

loading..........

Yo creo que era... porque al hacer un CloneNode de algun elemento DOM de un lugar a otro no copias los EVENT HANDLERS

obj.AttachEvent...blabla

pero sí los eventos del tipo.

objDOM.onclick=algo;

En cuanto al burbujeo lo solucionas con.

si es IE

(this !== window.event.srcElement) <-- es burbujeo

en Mozilla

(event.eventPhase == Event.BUBBLING_PHASE) <-- es burbujeo

y ya dependiendo de esto devuelves un FALSE en tu evento.

connection closed.

Panino5001 · #7 (**permalink**) 28/06/2007, 11:21

Para detener el burbujeo no es mejor esto?:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>TEST</title>

<script>

function mmousedown(e)

{

  var evt = e ? e : window.event; 

  alert('dentro de pepe');    

  if (evt.cancelBubble==false) {

        evt.cancelBubble=true;

  } 

  if(evt.stopPropagation && evt.stopPropagation()==undefined)  {

    evt.stopPropagation();

  } 

}

function test(){alert('fuera de pepe');}

</script>

</head>

 
<body>

<div id="pepe" style="cursor:pointer; background-color:#CCCCCC; border:1px solid #000000">testear</div>

<script>

document.getElementById('pepe').onmousedown = mmousedown;

document.onmousedown=test;

</script>

</body>

</html>

MaBoRaK · #8 (**permalink**) 28/06/2007, 11:31

loading........................

Es verdad, lo habia olvidado :p.... y yo implementando burbujeo en javascript.assembler jejejeje gracias!!

connection closed.

zyon · #9 (**permalink**) 29/06/2007, 07:02

wow, ahora si no se bien de lo que hablan jeje, solo espero pronto poder checarlo para entenderlo al 100, me salgo de un oyo y lo checare...

derkenuke · #10 (**permalink**) 29/06/2007, 19:58

Bueno, no soy muy dado a las librerías, pero recuerdo que motools tenía algo parecido para colocar una capa encima de otras...