HTML5 video subtitles and cue-points done easily

Cuepoint.js is a nice and useful open source jQuery plugin for adding HTML5 video subtitles and cue-points. To make it work you simply need to pass in an object that contains your slides to the cuepoint.init method (keep in mind, that the time is in seconds). See the example bellow on how to add HTML5 video cue-points.

$(document).ready(function(){
  var slides = {5:"Hello World"}
  cuepoint.init(slides);
  cuepoint.play();
});

If you want to create skip to links, you can easily use setTime(seconds) method and bind it to a jQuery click event like in the example bellow.

$('a').click(function(){
  cuepoint.setTime(60);
});

This HTML5 video subtitles and cue-point plugin is set under Creative Commons license so you can download and modify it to suit your needs.

HTML5 video subtitles and cue-points

HTML5 video subtitles and cue-points

Download/Demo cuepoint.js

Related Posts

JavaScript library to access Youtube information

Develop Rich HTML5 Applications with Montage

Create sortable lists and grids using native HTML5 drag and drop API

Library for interactive HTML5 visualizations

Leave a Reply