Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

221
Views
ondragstart - ¿Cómo eliminar la animación?

Cada vez que el usuario comienza a arrastrar un elemento con draggable="true" , el elemento tiene una copia translúcida del elemento que está arrastrando. Aquí está el ejemplo de W3Schools: dejar de iniciar la animación

El lado derecho de la foto es importante. Esa es la animación que obtienes cuando comienzas a arrastrar un elemento.

https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_ondrag

He intentado usar event.preventDefault() . Sin embargo, el problema aquí es que esto evita que onDrag mientras el elemento se está moviendo y necesito los datos (posición del mouse y demás) de onDrag .

Parece que hay publicaciones sobre cómo detener la animación cuando la sueltas pero no la inicias.

Saliendo del ejemplo en el sitio W3Schools, quiero la información de arrastre sin la animación ondragstart .

Entonces, si modifico el código agregando un preventDefault() en la función ondragstart :

 function dragStart(event) { console.log(event); event.preventDefault(); //stops animation in right side of photo, but then won't let ondrag fire event.dataTransfer.setData("Text", event.target.id); } function dragging(event) { console.log(event); document.getElementById("demo").innerHTML = "The p element is being dragged"; }

La animación que obtienes al arrastrar desaparece. Sin embargo (como se muestra en mis líneas console.log console.log) , el ondrag no se activará con este preventDefault en ondragstart . Esta es la información que necesito.

preventDefault dentro ondrag no detiene esa animación. ¿Es esto posible?

SOLUCIÓN Si alguien se pregunta, encontré lo que necesitaba hacer en este caso. Puede configurar la imagen en javascript a una transparente: ¿Cómo eliminar la imagen de arrastre (fantasma)? entonces, técnicamente, el arrastre aún se está ejecutando, pero esa imagen fantasmal se ha ido. No estaba pensando en los términos de búsqueda correctos.

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

En este caso, optaría por un enfoque diferente: https://codepen.io/deibl31/pen/oNeXmPE?editors=1111

 // HTML <div id="myDiv"> </div> // CSS #myDiv { position: absolute; height: 100px; width: 100px; background: black; color: white; } // JS let myDiv = document.getElementById('myDiv'); let mouseDown = false; let divPos = {x: 0, y: 0}; myDiv.addEventListener('mousedown', (event) => { mouseDown = true; }); window.addEventListener('mousemove', (event) => { if (mouseDown) { divPos.x = event.clientX; divPos.y = event.clientY; } }); window.addEventListener('mouseup', (event) => { if (mouseDown) { myDiv.style.top = divPos.y + 'px'; myDiv.style.left = divPos.x + 'px'; } mouseDown = false; });
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!