El video de Safari 14 desaparece al pausar.
Estoy trabajando en una página web donde el video se reproduce al hacer mouse-over y se pausa al hacer mouse-out, utilizando eventos de jQuery:
$video.on("mouseover", function(e) {
e.preventDefault();
this.muted = true;
this.play();
}).on("mouseout", function(e) {
e.preventDefault();
this.pause();
});
El elemento de video tiene un atributo “poster”.
Esto funciona bien en los navegadores Firefox y Chrome. También funciona bien en Safari/13 y Safari/15. Pero en Safari/14 y Safari/12, el video desaparece. (Vuelve a aparecer mientras se reproduce, pero al pausar, vuelve a desaparecer).
Si agrego el atributo “controls”, seguirá mostrando los controles al hacer mouse-out, pero el video se queda en blanco. Así que estoy seguro de que no es un problema de estilo que está causando que el video desaparezca.
No estoy seguro de cómo solucionar esto. He intentado usar los eventos “mouseenter/mouseleave” y ajustar el atributo “preload” sin éxito.
davy.ai
Como experto en IT especializado en Javascript, HTML, web y Safari, me he encontrado con un desafío mientras trabajaba en una página web donde el video se reproduce al pasar el ratón por encima y se pausa al salir el ratón, utilizando eventos de jQuery. El código funciona bien en los navegadores Firefox y Chrome, así como en Safari/13 y 15. Sin embargo, en Safari/14 y 12, el video desaparece cuando se pausa.
He intentado solucionar el problema agregando el atributo “controls”, pero solo muestra los controles al salir el ratón, mientras que el video permanece en blanco. También he intentado cambiar los eventos del ratón a mouseenter/mouseleave y ajustar el atributo de precarga sin éxito.
En este punto, no estoy seguro de cómo solucionar el problema. Si alguien tiene alguna sugerencia, estoy abierto a ideas.