前端实现画中画超简单，让网页飞出浏览器

文章预览

点击上方  程序员成长指北 ，关注公众号 回复 1 ，加入高级Node交流群 Document Picture-in-Picture 介绍 今天，我来介绍一个非常酷的前端功能： 文档画中画 (Document Picture-in-Picture, 本文简称 PiP)。你有没有想过，网页上的任何内容能悬浮在桌面上？😏 🎬 视频流媒体的画中画功能 你可能已经在视频平台（如 腾讯视频 、 哔哩哔哩 等网页）见过这种效果：视频播放时，可以点击画中画后。无论你切换页面，它都始终显示在屏幕的最上层，非常适合 上班偷偷看电视 💻 在今天的教程中，不仅仅是视频，我将教你如何 将任何 HTML 内容放入画中画 模式，无论是动态内容、文本、图片，还是纯炫酷的 div，统统都能“飞”起来。✨ 一个如此有趣的功能，在网上却很少有详细的教程来介绍这个功能的使用。于是我决定写一篇详细的教程来教大家如何实现画中画 ( ………………………………