Skip to main content
se eliminaron 39 caracteres en el cuerpo
Origen Enlace
padaleiana
  • 3.3k
  • 13
  • 19
  • 27

Buenas :) tengoTengo un error con esta función de JS, el cual da el error de abajo y no sé como solucionarlo. Es acerca de un reproductor de vídeo. El fallo se produce al tocar la barra de desplazamiento del vídeo para adelantar o retroceder el vídeo. Muchas gracias de antemano. La función es:

Buenas :) tengo un error con esta función de JS, el cual da el error de abajo y no sé como solucionarlo. Es acerca de un reproductor de vídeo. El fallo se produce al tocar la barra de desplazamiento del vídeo para adelantar o retroceder el vídeo. Muchas gracias de antemano. La función es:

Tengo un error con esta función de JS, el cual da el error de abajo y no sé como solucionarlo. Es acerca de un reproductor de vídeo. El fallo se produce al tocar la barra de desplazamiento del vídeo para adelantar o retroceder el vídeo. La función es:

Origen Enlace

Error double value is non-finite JavaScript en un reproductor de vídeo JS

Buenas :) tengo un error con esta función de JS, el cual da el error de abajo y no sé como solucionarlo. Es acerca de un reproductor de vídeo. El fallo se produce al tocar la barra de desplazamiento del vídeo para adelantar o retroceder el vídeo. Muchas gracias de antemano. La función es:

function desplazarMedio(e) {
    if (!medio.paused && !medio.ended) {
        var ratonX = e.pageX - barra.offsetLeft;
        var maximo = parseInt(getStyle('barra', "width"));
        var nuevoTiempo = ratonX * medio.duration / maximo;
        medio.currentTime = nuevoTiempo;
        progreso.style.width = ratonX + 'px';
    }
}

Y el error (da error en la línea "medio.currentTime = nuevoTiempo":

Uncaught TypeError: Failed to set the 'currentTime' property on 'HTMLMediaElement': The provided double value is non-finite.
    at HTMLDivElement.desplazarMedio (reproductor.js:135:21)

El código entero es:

function iniciar() {
    maximo = 700;

    medio = document.getElementById('medio');
    reiniciar = document.getElementById("reiniciar");
    retrasar = document.getElementById("retrasar");
    play = document.getElementById('play');
    adelantar = document.getElementById("adelantar");
    silenciar = document.getElementById("silenciar");
    menosVolumen = document.getElementById("menosVolumen");
    masVolumen = document.getElementById("masVolumen");
    barra = document.getElementById('barra');
    progreso = document.getElementById('progreso');

    reiniciar.addEventListener("click", accionReiniciar, false);
    retrasar.addEventListener("click", accionRetrasar, false);
    play.addEventListener('click', accionPlay, false);
    adelantar.addEventListener("click", accionAdelantar, false);
    silenciar.addEventListener("click", accionSilenciar, false);
    menosVolumen.addEventListener("click", accionMenosVolumen, false);
    masVolumen.addEventListener("click", accionMasVolumen, false);
    barra.addEventListener('click', desplazarMedio, false);
}

function setVolumen(valor) {
    var volumen = medio.volume;

    volumen += valor;

    if (volumen >= 0 && volumen <= 1) {
        medio.volume = volumen;
    } else {
        if (volumen < 0)
            medio.volume = 0;
        else
            medio.volume = 1;
    }
}

function accionMenosVolumen() {
    setVolumen(-.1)
}

function accionMasVolumen() {
    setVolumen(.1)
}

function setTiempo(tValue) {
    if (tValue == 0) {
        medio.currentTime = tValue;
    } else {
        medio.currentTime += tValue;
    }

    redimensionaBarra();
}

function accionRetrasar() {
    setTiempo(-5);
}

function accionAdelantar() {
    setTiempo(5);
}

function accionReiniciar() {
    setTiempo(0);
}

function accionPlay() {
    if (!medio.paused && !medio.ended) {
        medio.pause();
        play.value = '\u25BA';
        window.clearInterval(bucle);
    } else {
        medio.play();
        play.value = '||';
        bucle = setInterval(redimensionaBarra, 1000);
    }
}

function accionSilenciar() {
    if (medio.muted) {
        medio.muted = false;
        silenciar.value = "silenciar";
    } else {
        medio.muted = true;
        silenciar.value = "escuchar";
    }
}

/*function redimensionaBarra()
{
    if(!medio.ended)
    {
        var total=parseInt(medio.currentTime*maximo / medio.duration);
        progreso.style.width=total+'px';
    }
    else
    {
        progreso.style.width='0px';
        play.value='\u25BA';
        window.clearInterval(bucle);
    }
}*/

function redimensionaBarra() {
    if (!medio.ended) {
        var maximo = parseInt(getStyle('barra', "width"));
        var total = parseInt(medio.currentTime * maximo / medio.duration);
        progreso.style.width = total + 'px';
    } else {
        progreso.style.width = '0px';
        play.value = '\u25BA';
        window.clearInterval(bucle);
    }
}

/*function desplazarMedio(e)
{
    if(!medio.paused && !medio.ended)
    {
        var ratonX=e.pageX-barra.offsetLeft;
        var nuevoTiempo=ratonX*medio.duration/maximo;
        medio.currentTime=nuevoTiempo;
        progreso.style.width=ratonX+'px';
    }
}*/

function desplazarMedio(e) {
    if (!medio.paused && !medio.ended) {
        var ratonX = e.pageX - barra.offsetLeft;
        var maximo = parseInt(getStyle('barra', "width"));
        var nuevoTiempo = ratonX * medio.duration / maximo;
        medio.currentTime = nuevoTiempo;
        progreso.style.width = ratonX + 'px';
    }
}

function getStyle(nombreElemento, nombrePropiedad) {
    var elemento = document.getElementById(nombreElemento);
    return
window.getComputedStyle(elemento, null).getPropertyValue(nombrePropiedad);
}

window.addEventListener('load', iniciar, false);