Flowplayer and Captions (Subtitles)

submit to reddit

Actually I couldn’t mange to make it work with a non-javascript approach, but however with the .js help it works. I’ll paste here this code, hopefully this will help.

Note that you’ve to change plugins/javascripts/videos/captions path!

<html>
<body>
<div id="player" style="width:480px;height:360px"></div>
<script src="Flowplayer.Captions/flowplayer-3.2.2.min.js"></script>
<script>
 
$f("player", "Flowplayer.Captions/flowplayer-3.1.5.swf", {
    clip : {
        url : "Flowplayer.Captions/bach.flv",
        captionUrl : 'Flowplayer.Captions/bachen.srt'
    },
    plugins:  {
        captions: {
            url: 'Flowplayer.Captions/flowplayer.captions-3.2.1.swf',
            captionTarget: 'content'
        },
        content: {
            url : 'Flowplayer.Captions/flowplayer.content-3.2.0.swf',
            bottom: 5,
            height: 50,
            backgroundColor: 'transparent',
            backgroundGradient: 'none',
            border: 0,
            textDecoration: 'outline',
            style: {
                body: {
                    fontSize: 15,
                    fontFamily: 'Arial',
                    textAlign: 'center',
                    color: '#ffffff'
                }
            }
        },
        controls: {
            url : 'Flowplayer.Captions/flowplayer.controls-3.1.5.swf'
        }
    }
});
 
setTimeout(function() {
    $f('player').getPlugin('captions').loadCaptions(0, 'Flowplayer.Captions/bachbg.srt');
}, 3000);
 
</script>
</body>
</html>

Related posts:

  1. object and embed tags revealed
  2. Flex 3 Custom Preloader Download
  3. Profiling JavaScript with Firebug. console.profile() & console.time()!

You are a GREAT developer? Click here to answer the weekly quiz!

This entry was posted in javascript, web development and tagged , , , , , . Bookmark the permalink.

4 Responses to Flowplayer and Captions (Subtitles)

  1. eddai says:

    do you know how we can add multiple subtitles ? so we can change subtitles on fly during running video ?

  2. Stoimen says:

    Sure,

    actually I was trying to do the similar, and as far as I remember it was very easy. You can try with something like:

    $f('player').getPlugin('captions').loadCaptions(0, 'Flowplayer.Captions/my.srt');

    during the playback. Please try with this and if something goes wrong I’ll try to simulate it.

    greetings

  3. eddai says:

    Hi,
    I’ve tried but could not implement this on my site..
    could u please drop me an email please ?
    if you are free to make this working on my site at a cost you decide..
    I will appreciate

    I just want a working one like in this site..
    http://www.europafilmtreasures.eu/fiche_technique.htm?ID=277

  4. Pat says:

    I’ve been working on putting multiple srt files on one video for over a week. Please HELP!

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">