Intento que cuando hago MOUSE WHEEL siga funcionando el dragdrop, en jQuery funciona pero si quiero hacerlo nativo en javascript no funciona, a alguien le ha pasado esto? Intento poner este evento pero no puedo solucionarlo...
no soluciona el problema document.addEventListener("mousewheel", function( event ){ event.preventDefault(); }, false);
var dragged; document.addEventListener("drag", function( event ){ //console.log("A"); }, false); document.addEventListener("dragstart", function( event ){ dragged = event.target; //console.log("B"); event.target.style.opacity = .5; }, false); document.addEventListener("dragend", function( event ){ event.target.style.opacity = ""; //console.log("C"); }, false); document.addEventListener("dragover", function( event ){ event.preventDefault(); //console.log("D"); }, false); document.addEventListener("dragenter", function( event ){ if( event.target.className == 'dropzone' ){ console.log("E"); event.target.style.background = "red"; } }, false); document.addEventListener("dragleave", function( event ){ if( event.target.className == 'dropzone' ){ console.log("F"); event.target.style.background = ""; } }, false); document.addEventListener("drop", function( event ){ event.preventDefault(); if( event.target.className == "dropzone" ){ //console.log("G"); event.target.style.background = ""; dragged.parentNode.removeChild(dragged); event.target.appendChild( dragged ); } }, false); // DOES NOT FIX THE PROBLEM document.addEventListener("mousewheel", function( event ){ event.preventDefault(); }, false); <div class="dropzone"> <div class="draggable" draggable="true" ondragstart="event.dataTransfer.setData('text/plain',null)"> Hi!.! </div> </div> <div class="dropzone"></div> <div class="dropzone"></div> <div class="dropzone"></div> <style> .dropzone{ width: 200px; min-height: 25px; margin-bottom: 300px; background-color: violet; border: 1px solid #9457EB; padding: 5px; transition: 1000m easy all; } .draggable{ background-color: white; padding: 3px; text-align: center; transition: 400ms ease all; } .draggable:hover{ background-color: yellow; } </style>