Changing video playback speed in Vimeo

Posted on 29 Nov 2013

I watch a lot of conference session videos, lectures, and screencasts. I don’t have a lot of time. What I tend to do as a result is listen to them at 1.5, or 2 times the speed. That way I can get the content without the pauses, the ums, and the waiting around for everybody to catchup.

This is really easy with youtube. You just go to the http://youtube.com/html5 and enable html5 as your default player, the little quality cog on each video then gives you the option to change the speed. However, vimeo, home of many an excellent conference recording, refuses to let you do this. So, what’s a web dev to do?

Vimeo’s player is already HTML5, so one solution is to just open up the devtools in Chrome and just change the speed with the HMTL5 video API. My method is to open a dev tools console, and run this:

document.getElementsByTagName('video')[0].playbackRate = 1.5

If you’re looking at a site which has embedded a vimeo player in an iframe, you can’t just script this, because of origin-domain protection. However, you can browse to the element in the dev tools, right click and Inspect DOM properties. This will give you all the properties of the video on the console, you can then just edit the playbackRate line to whatever you want. Here’s a quick screen cast showing you how to do that. Feel free to play it any speed you like :)

StackOverflow Flair

profile for Simon Elliston Ball at Stack Overflow, Q&A for professional and enthusiast programmers