一个 Alt+P,让视频永远悬浮在屏幕角落:Chrome 画中画扩展上手记

📅 2026/8/13 13:45:14
一个 Alt+P,让视频永远悬浮在屏幕角落:Chrome 画中画扩展上手记
一个 AltP让视频永远悬浮在屏幕角落Chrome 画中画扩展上手记【免费下载链接】picture-in-picture-chrome-extension项目地址: https://gitcode.com/gh_mirrors/pi/picture-in-picture-chrome-extension你有没有遇到过这种时刻网课正讲到关键公式你切到文档做笔记的瞬间画面就跟着标签页一起消失了Chrome 画中画扩展picture-in-picture-chrome-extension就是为这个场景而生的——它把正在播放的视频变成一个小窗悬浮在屏幕最上层。你切去任何标签页、任何窗口视频都稳稳地钉在那里继续放声音和画面一个都不掉队。三步完成快速安装从仓库拉取并加载到 Chrome如果暂时不方便访问应用商店或者你想直接用源码体验完全可以从 Git 仓库拿。打开终端执行git clone https://gitcode.com/gh_mirrors/pi/picture-in-picture-chrome-extension拿到项目后在 Chrome 地址栏输入 chrome://extensions打开右上角的开发者模式点击加载已解压的扩展程序选中刚才 clone 下来的根目录三步就完成了。整个项目只有 src/ 一个目录轻量得不像话也没有任何依赖要装。一键进入画中画按 AltP 自动选中正在播放的视频安装好之后随便打开一个带视频的页面比如 YouTube 或 Bilibili直接按 AltP。你可能担心页面上有多个视频怎么办——不用操心脚本会自动找出当前正在播放且面积最大的那个。翻一下 script.js 里 findLargestPlayingVideo() 的逻辑就会发现它先过滤掉尚未就绪的 video 标签也跳过声明了 disablePictureInPicture 的再按实际渲染尺寸从大到小排序精准得像个挑片老手。更有意思的是再按一次 AltP视频就从悬浮窗回到原页面。这个快捷键本身就是开关不存在找退出按钮这种麻烦事。多个视频同时存在时自动切换画中画对象一个页面往往同时挂着广告视频、推荐列表和你在看的正片。这个扩展的处理方式相当聪明它用 ResizeObserver 持续盯着当前画中画视频一旦发现页面里冒出了更大的、正在播放的视频——比如你在播放列表里点了下一集——就自动把悬浮窗交接给新视频。整个过程你什么都不用做不需要先退出再重新进入追剧体验直接拉满。进阶体验开启自动画中画让视频主动入窗如果你连 AltP 都懒得按还有更省事的方案。右键点击扩展图标勾选 Automatic picture-in-picture (BETA)图标上立刻多出一个 ★ 角标代表自动模式已生效。之后把播放中的视频切到后台标签页视频会自己乖乖跳进画中画窗口。背后的原理是 autoPip.js 里注册的 enterpictureinpicture 媒体会话回调——它把浏览器原生的媒体控制能力接了过来属于典型的用标准能力做极简交互。按需自定义配置改快捷键或直接读源码默认快捷键在 Windows、macOS、Linux 上都是 AltP。如果你觉得它跟输入法或某个软件打架打开 chrome://extensions/shortcuts 就能改成任意组合键全程点几下鼠标。想深入研究实现的话代码结构也足够友好background.js 负责快捷键与右键菜单script.js 负责选视频和呼出画中画autoPip.js 管自动模式manifest.json 按 Manifest V3 规范组织。没有框架、没有构建步骤一行行读下来基本没有门槛。从被迫在视频和工作之间二选一到视频乖乖待在角落陪着你干活差别不过是一个几 KB 的扩展加一个按键。现在就 clone 下来加载进你的 Chrome 试试吧下一个不用来回切标签页的人就是你了。【免费下载链接】picture-in-picture-chrome-extension项目地址: https://gitcode.com/gh_mirrors/pi/picture-in-picture-chrome-extension创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考