3

Subtítulos en la web

24Feb
en API, Desarrollo web, Javascript, Tutoriales

Hoy les traigo esta excelente librería javascript que permite agregar subtítulos .str a nuestros videos en la web, veamos cómo funciona.

Primero incluimos la librería en la página.


<script src="videosub.js"></script>

Dentro de las etiquetas video ponemos una línea que incluya los subtítulos como aparece en el ejemplo.


<video controls >

<source src="Mozilla_2011_Story.webm" type="video/webm" />

<track src="YouTube.srt" kind="subtitle" srclang="en-US" label="English" />

Your browser does not support HTML5 video.

</video>

Eso es todo, ya tenemos nuestro video subtitulado con un .str.

Hasta ahora el único problema que tiene es la codificación, ya que aparecen los caracteres como la “ñ” con símbolos raros.

Por ahora pueden descargar la librería aquí.

VideoSub.js

0.02 MB

Si lo desean pueden revisar el código en github.

Etiquetado en:

3 Comentarios

  1. Nilmar dice:

    Por mucho muy interesante esta propuesta a la verdad que la inventiva va mas alla de lo que uno puede si quiera imaginarse

  2. Yosbel Marin dice:

    Saludos, tengo una solucion para ver bien los caracteres latinos. Para esto hace falta un servidor web + php
    hacemos un fichero llamado “sub.php” y le ponemos dentro el siguiente codigo -no olvidar el tag de apertura de php-:

    $sub = realpath(dirname(__FILE__).DIRECTORY_SEPARATOR.$_GET[‘src’]);
    echo utf8_encode(is_file($sub) ? file_get_contents($sub) : “1
    00:00:01,418 –> 00:00:05,328
    El subtítulo ({$_GET[‘src’]}) no pudo ser encontrado”);

    Guardamos y ya está, ahora podemos pedir el subtitulo a travez de el atributo src (src=”sub.php?src=MySubtitulo.srt”) en el tag “track”
    Nota: la ruta de los subtitulos es relativa al fichero sub.php

  3. Yunier J dice:

    Creo que en Firefox 31 o 32 ya añadieron el soporte para subtítulos

Dejar un comentario