2011-11-15 15 views
6

Cómo adjuntar html-element al cursor del mouse usando jQuery. Esto debería ser algo así como 'arrastrable', pero quiero que ese elemento se adhiera al cursor después de hacer doble clic en el mouse y seguir el cursor hasta que se presiona el botón izquierdo del mouse.¿Cómo adjuntar html-element al mouse usando jQuery?

+1

Tenga en cuenta que esto puede ser confuso para la mayoría de los usuarios, que están acostumbrados a la interfaz de arrastrar y soltar clic de la mayoría de los sistemas operativos modernos. – Blazemonger

Respuesta

13

Querrá usar .mousemove() y .offset().

$("#clickedElement").dblclick(function() { 
    var $someElement = $("#elementToCling"); 
    $(document).mousemove(function (e) { 
     $someElement.offset({ top: e.pageY, left: e.pageX }); 
    }).click(function() { 
     $(this).unbind("mousemove"); 
    }); 
}); 

demostración de trabajo:http://jsfiddle.net/EbbxA/

+0

+1: Esto parece prometedor. –

+1

Demostración alternativa: http://jsfiddle.net/a4eFE/ porque estaba aburrido y se veía genial. –

+0

¡Gracias! Esto es lo que yo quería. Pero, ¿qué pasa si quiero poder utilizar las opciones "arrastrables", como "ajustar", "revertir", "contención", etc. ¿Cómo hago esto? – user1048261

Cuestiones relacionadas