1

I have been working with the HTML5 video tag and I want to achieve one thing, I need a number of screenshots of different parts of the video presented at the same time, like a set of thumbnails below the original video.

So far, I have tried with various methods that I have found online, but no success so far.

What I want to achieve is something like this: http://open.bbc.co.uk/rad/demos/html5/rdtv/episode2/index.html

Any help would be appreciated, thanks in advance.

rpabon
  • 1,191
  • 2
  • 16
  • 22
  • 1
    Those thumbnails are probably generated server-side. – ZippyV Apr 24 '12 at 11:37
  • They certainly aren't generated from the client as it plays the video since (1) They are all available before the *entire* video stream has been loaded and (2) They have their own URIs: http://open.bbc.co.uk/rad/demos/html5/rdtv/episode2/ingex.jpg – Quentin Apr 24 '12 at 11:41

2 Answers2

1

Have you tried "javaScript canvas snapshot"?

http://html2canvas.hertzen.com/

Can you take a "screenshot" of the page using Canvas?

Using HTML5/Canvas/JavaScript to take screenshots

There are also "headless webkit browsers" if you want to this semi-automatically on your desktop &/or server with Node.jx

Community
  • 1
  • 1
tomByrer
  • 1,105
  • 12
  • 21
0

This is not possible. You cannot access the data in the video stream to get the screenshots out from JavaScript. You'll have to do this server-side.

Ben Clayton
  • 80,996
  • 26
  • 120
  • 129