Tengo un reproductor de audio con una barra de progreso, y cuando froto la barra de progreso, no funciona correctamente cuando los mapas de origen están habilitados en Chrome. Si arrastra el mouse moderadamente rápido, la barra de progreso se restablece a cero hasta que el mouse se ralentiza o se detiene. Se arrastra suavemente cuando los mapas de origen están deshabilitados.
Alguna idea de cómo solucionar este problema? ¿Por qué solo sucede cuando los mapas de origen están habilitados? Alternativamente, ¿hay alguna forma de deshabilitar los mapas de origen en javascript, no en el navegador? Vi esto en esta publicación , pero no puedo hacer que funcione.
seekbars = document.querySelectorAll('.seekbar'); seekbars.forEach(function (seekbar) { var index = seekbar.id.replace('seekbar',''); let mousedown = false; let dragging = false; seekbar.addEventListener('mousedown', function() { mousedown = true; //ensure only one audio player is playing at a time if (current_player != index) { turnOff(current_player); togglePlay(index); } current_player = index; }); document.addEventListener('mouseup', function() { mousedown = false; if (dragging) { turnOn(index); dragging = false; } }); document.addEventListener('mousemove', function(event) { if (mousedown) { dragging = true; mouseX = event.pageX; tempOff(index); //this is basically turnOff(index) seekPos(mouseX,seekbar, index); } }); }); function seekPos(mouseX, seekbar, index) { var player = document.querySelector("#player"+index); var mouseXRelative = mouseX - $('#seekbar'+ index + ' .value').offset().left; var percent = mouseXRelative / seekbar.offsetWidth; player.currentTime = percent * player.duration; $('#seekbar'+ index + ' .value').css("width", percent+"%"); }