Varias bibliotecas de JavaScript, como jQuery UI, ofrecen interacciones de arrastrar y soltar donde puede constrain the movement del elemento arrastrado a un solo eje o dentro de un área particular.Cómo restringir el movimiento cuando se usa arrastrar y soltar HTML5 nativo?
¿Es posible este tipo de cosas utilizando la API nativa HTML5 drag and drop?
¡Es totalmente diferente! El jQuery UI arrastra y suelta el elemento move (con las propiedades superiores e izquierdas de CSS) en la página.
La API nativa de arrastrar y soltar HTML5 solo le permite mover un "fantasma" del elemento arrastrable (por supuesto, puede ocultar el elemento original mientras arrastra el fantasma).
La API viene con a lot of event pero no, no puede restringir la posición del mouse para que no pueda restringir a un solo eje (porque el fantasma sigue la posición del mouse, aunque el mouse salga de la página). dejar de operar)).
+1, actualicé el enlace de W3Schools a MDN para evitar que este sea el tema de la pregunta. –
Nunca me he vinculado a W3schools, fue alguien quien editó mi pregunta. Este sitio es cojo – callum
Vincular a w3schools debe considerarse como un delito grave. – artistoex
posible duplicado de [HTML5: arrastrar/soltar en el eje X y sin fundido?] (Http://stackoverflow.com/questions/8933513/html5-drag-drop-on-x-axis-and-without-fade) – SiliconMind
Sé que esta es una publicación anterior ... pero lo resolví creando un elemento clónico en 'dragstart', ocultando el original y luego estableciendo la posición del clon con el evento' dragover', donde puede restringirse. No es muy diferente de usar 'mousemove'. Era más fácil que reescribir por completo el método de arrastrar y soltar, que estoy seguro que muchos tienen. – mseifert