Ver Mensaje Individual
  #1 (permalink)  
Antiguo 03/10/2011, 03:51
Avatar de Gato_preto
Gato_preto
 
Fecha de Ingreso: julio-2009
Ubicación: Madrid
Mensajes: 20
Antigüedad: 14 años, 9 meses
Puntos: 0
Div que no se mueve, solo se ve la mano al pasar por encima

Hola a todos, estoy intentando crear una div movible con el ratón y no consigo hacerla funcionar.
Esta es la página: [URL="http://corporationsenaki.com/entrada_tmp2.php#"]http://corporationsenaki.com/entrada_tmp2.php#[/URL]

El código que he puesto es el siguiente:
Código Javascript:
Ver original
  1. //Si el navegador del cliente es Mozilla la variable siguiente valdrá true
  2.             var moz = document.getElementById && !document.all;
  3.             //Flag que indica si estamos o no en proceso de arrastrar el ratón
  4.             var estoyArrastrando = false;
  5.             //Variable para almacenar un puntero al objeto que estamos moviendo
  6.             var dobj;
  7.  
  8.             function presionarBoton(e) {
  9.             //Obtenemos el elemento sobre el que se ha presionado el botón del ratón
  10.             var fobj = moz ? e.target : event.srcElement;
  11.  
  12.             // Buscamos el primer elemento en la que esté contenido aquel sobre el que se ha pulsado
  13.             // que pertenezca a la clase mb_content_wrapper. Esto es necesario por si hemos pinchando sobre
  14.             // un elemento contenido dentro de otro pero este último es el que pertenece a la clase
  15.             // mb_content_wrapper
  16.             while (fobj.tagName.toLowerCase() != "html" && fobj.className != "mb_content_wrapper") {
  17.             fobj = moz ? fobj.parentNode : fobj.parentElement;}
  18.  
  19.             // Si hemos obtenido un objeto movible...          
  20.             if (fobj.className == "mb_content_wrapper") {
  21.             // Activamos el flag para indicar que se empieza a arrastrar
  22.             estoyArrastrando = true;
  23.             // Guardamos un puntero al objeto que se está moviendo en la variable global
  24.             dobj = fobj;
  25.             // Devolvemos false para no realizar ninguna acción posterior
  26.             return false;}
  27. }
  28. //Asociamos la función al evento onmousedown
  29. document.onmousedown = presionarBoton;
  30.  
  31. function arrastrarRaton(e){
  32.   if (estoyArrastrando) {
  33.     // Obtenemos las coordenadas X e Y del ratón (de forma diferente dependiendo del navegador del cliente)
  34.     newLeft = moz ? e.clientX : event.clientX;
  35.     newTop = moz ? e.clientY : event.clientY;
  36.  
  37.     // Posicionamos el objeto en las nuevas coordenadas y aplicamos unas desviaciones
  38.     // horizontal y vertical correspondientes a la mitad del ancho y alto del elemento
  39.     // que movemos para colocar el puntero en el centro de la capa movible.
  40.     dobj.style.left = newLeft - parseInt(dobj.style.width)/2;
  41.     dobj.style.top = newTop - parseInt(dobj.style.height)/2;
  42.  
  43.     // Devolvemos false para no realizar ninguna acción posterior
  44.     return false;
  45.   }
  46. }
  47. //Asociamos la función al evento onmousemove
  48. document.onmousemove = arrastrarRaton;
  49.  
  50. function soltarBoton(e) {  
  51.   estoyArrastrando = false;
  52. }
  53. //Asociamos la función al evento onmouseup
  54. document.onmouseup = soltarBoton;

No se si el fallo está en el código ese o está teniendo alguna incompatibilidad con el jquery. Me podría alguien echar una mano?
Saludos.