Picture in Picture Button

WHAT IT DOES

Picture in Picture Button adds a Picture-in-Picture (PiP) button to every HTML5 video on the current page. Click the button to pop the video out into a floating, always-on-top window that stays visible even when you scroll or switch tabs. The button appears when you hover over a video and can be positioned in any corner of the video player. You can also click directly on the video to enter PiP mode, enable auto-PiP that activates when a video starts playing, and the tool remembers your last PiP video so you can pick up where you left off. The PiP window can be resized and repositioned on your screen.

WHERE IT RUNS

The extension runs entirely within your browser's local environment using the BotGentz framework. All video detection, button creation, and PiP control occur on your machine without any network requests. No video data, browsing activity, or user settings are ever transmitted, uploaded, or stored externally. The tool works on any website and respects the browser's security boundaries, operating within the isolated extension sandbox. Picture-in-Picture uses the browser's native PiP API.

HOW TO USE

Click the extension toolbar icon to open the Picture in Picture Button panel. Click "Enter PiP" to put the currently playing video (or the first video on the page) into Picture-in-Picture mode. Click "Exit PiP" to close the floating window. Click "Refresh Videos" to detect newly added video elements. Toggle "Show PiP button" to show or hide the PiP button on videos. Toggle "Auto PiP on play" to automatically enter PiP mode when a video starts playing. Toggle "PiP on click (video)" to enable PiP when you click directly on the video. Toggle "Remember last video" to restore the last PiP video when you return to a site. Change the button position using the dropdown (Top Right, Top Left, Bottom Right, Bottom Left). The panel shows whether PiP is currently active.

THE PICTURE-IN-PICTURE ENGINE — WHY IT WORKS

Most PiP solutions rely on browser extensions with complex permissions or site-specific implementations. This tool uses the native HTML5 Picture-in-Picture API (document.requestPictureInPicture()) which is built into modern browsers. When you activate PiP, the browser creates a separate window that contains the video element, with its own playback controls. The tool detects all video elements on the page using querySelectorAll("video"), then attaches a custom button overlay to each one using absolute positioning relative to the video. The button appears on hover with CSS opacity transitions for a clean user experience. The auto-PiP feature listens for the play event on each video and triggers PiP automatically. The "remember last video" feature stores the video source URL in GM_setValue and attempts to restore it when the page reloads. This approach leverages the browser's native capabilities while adding convenience features that make PiP more accessible and automatic.

THE PANEL

The Picture in Picture Button panel is fully draggable by its title bar and remembers its position on screen per website. It snaps to the edges of your browser window for clean alignment. Collapse the panel to a compact icon strip using the minimize button, restoring it with a single click. Resize the panel by dragging any edge or corner; the PiP controls and options adjust proportionally. Press the Escape key to close the panel instantly. The panel maintains independent state for each browser tab, allowing you to control PiP in multiple tabs simultaneously.

PLEASE NOTE

This extension requires the free BotGentz extension framework to be installed and enabled. Picture-in-Picture is not supported in all browsers; the tool detects support and gracefully handles unsupported browsers. Some websites may have custom video players that wrap the video element in complex containers; the button may not appear on all such players. Videos from embedded iframes (YouTube, Vimeo, etc.) may not support PiP due to cross-origin restrictions. All PiP data is processed locally and is never transmitted, logged, or shared. The extension requests no network permissions and functions entirely offline. The source code is fully auditable and available for review.