Automatically pause video when it’s not visible

Download the Hold It! extension

I’ve built a Google Chrome extension called Hold It! that pauses video when it’s not visible.

For example, when you:

  • minimise a window with a video playing in it
  • move to a different tab
  • open a video link in a new hidden tab.

Video play resumes automatically when it becomes visible again.

Useful when viewing videos on multiple tab pages, or if you click a link to open a video in a new, hidden tab.

Works for YouTube, Vimeo and on any site that uses the HTML video element.

Caveats: does not work for YouTube advertisements, and does not work on bbc.co.uk and some other sites. If you have a solution, let me know!

You can get it (for free!) from the Google Chrome Webstore.

How to use the extension

After installing the extension, any playing video will be paused when you move to a different tab or minimise a window. If you click on a link to open a video in a new, hidden tab, the video will be paused until you move to the new tab.

How does it work?

This extension uses the Page Visibility API.

The API can be used to check when a web page is visible to the user or not.

If you minimise your browser window, or move to another tab, the API fires a webkitvisibilitychange event.

When a new page loads, the extension looks for videos on the page — including Flash video and HTML video elements. If the page is not visible, or becomes hidden, all playing videos on the page are paused. Play restarts (for videos that were playing) once they become visible again.

Advertisements

About Sam Dutton

I am a Developer Advocate for Google Chrome. I grew up in rural South Australia, went to university in Sydney, and have lived since 1986 in London, England. Twitter: @SW12
This entry was posted in Uncategorized. Bookmark the permalink.

One Response to Automatically pause video when it’s not visible

  1. Brian B. says:

    This is the best thing that ever happened to me! It works great and saves much time. Best extension out there.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s