一款专业的 Chrome 浏览器插件,用于遮挡网页视频中的字幕。采用高斯模糊效果,既能有效遮挡字幕,又保留了画面的光影氛围,提供沉浸式的观看体验。
- 智能识别:自动检测网页中正在播放的视频,无需手动选择。
- 高斯模糊:使用毛玻璃效果遮挡字幕,美观且不突兀。
- 自动锚定:无论全屏、窗口调整还是分辨率变化,遮挡条始终紧贴视频画面。
- 灵活调整:
- 调整高度:拖动遮挡条顶部的边缘即可改变高度。
- 调整位置:按住 Shift 键 并拖动遮挡条任意位置,即可上下移动。
- 记忆功能:自动记住你调整后的大小和位置比例。
- 快捷控制:通过点击插件图标,可以快速开启/关闭遮挡,或调整模糊程度。
由于本插件尚未发布到 Chrome 应用商店,你需要通过“加载已解压的扩展程序”来安装:
- 下载本项目代码到本地。
- 打开 Chrome 浏览器,在地址栏输入
chrome://extensions/并回车。 - 在右上角开启 "开发者模式" (Developer mode)。
- 点击左上角的 "加载已解压的扩展程序" (Load unpacked) 按钮。
- 选择本项目所在的文件夹(包含
manifest.json的文件夹)。 - 安装完成!现在打开任意视频网站(如 Bilibili, YouTube),播放视频即可看到效果。
- 开启/关闭:点击浏览器右上角的插件图标,使用开关按钮。
- 调整模糊度:在插件弹窗中拖动滑块,实时调整模糊程度。
- 调整遮挡条:
- 鼠标移动到视频底部,会出现模糊遮挡条。
- 调整高度:按住遮挡条顶部的边缘上下拖动。
- 调整位置:按住键盘上的 Shift 键,然后按住遮挡条任意位置上下拖动。
- 自动隐藏:鼠标悬停在视频区域时,遮挡条会自动变透明,方便操作底部进度条。
本项目基于 Chrome Extension Manifest V3 开发。
manifest.json: 插件配置文件。content.js: 核心逻辑,负责视频检测、DOM 注入和交互处理。content.css: 遮挡条的样式定义。popup.html/popup.js: 插件弹窗界面逻辑。icons/icon.svg: 插件图标(SVG 格式)。
注意:虽然 Chrome 浏览器对 SVG 图标的支持在不断改进,但为了获得最佳的兼容性(特别是在某些旧版本或特定界面中),建议将
icons/icon.svg转换为 PNG 格式(如icon16.png,icon48.png,icon128.png)并在manifest.json中更新引用。
MIT