Picture in Picture for Chrome

Picture-in-Picture (PiP) allows you to watch videos in a floating window (always on top of other windows) so you can keep an eye on what you’re watching while interacting with other sites, or applications.


  • Front End Developer


  • JavaScript
  • Picture-in-Picture API


  • February 2019
Picture in Picture browser application

Project Purpose and Goal

When the Picture-in-Picture API was available to developers, I decided to make the feature more accesible to the avergae user. Being a developer, I knew how to navigate the browser settings and configurations to activate PiP for when I want to watch Netflix but go through my Twitter feed at the same time.

PiP video

Web Technologies and Explanation

Picture-in-Picture made its first appearance on the web in the Safari browser with the release of macOS Sierra in 2016. It made it possible for a user to pop a video out into a small floating window that stays above all others, so that they can keep watching while doing other things. It’s an idea that came from TV, where, for example, you might want to keep watching your Popular Sporting Event even as you browse the guide or even other channels.

Pip browser settings

Final Thoughts

Working with the Picture in Picture API, opened my eyes to all the things the browser has to offer, and gave me insight on some not so popular browser APIs that can be utilized in to make our day to day lives eaiser.