Estoy buscando crear un fondo de paralaje de video , pero quiero que el progreso del video corresponda a donde estoy en mi página web.
Por ejemplo :
Tienes que dividir el gran problema en problemas más pequeños.
Primero, necesitas obtener la duración de tu video :
var vid = document.getElementById("myVideo"); duration = vid.duration;A continuación, debe obtener la cantidad de desplazamiento en porcentaje
function getVerticalScrollPercentage (elm) { var p = elm.parentNode return (elm.scrollTop || p.scrollTop) / (p.scrollHeight - p.clientHeight ) * 100 }A continuación, debe configurar dinámicamente el tiempo actual de su video (en segundos), puede hacerlo de esta manera:
vid.currentTime = duration * percentage / 100; Y finalmente, debe configurar el tiempo actual nuevamente, cada vez que cambie la cantidad de desplazamiento. Eso se logra mediante el uso de un detector de eventos, en el body , por ejemplo.
object.addEventListener("scroll", myScript);Ahora ponlo todo junto :)