B站视频增强:缩放、旋转、拖拽

为B站视频添加缩放、旋转、拖拽移动和还原功能

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

作者
simayifeng
今日安裝
0
安裝總數
33
評價
0 0 0
版本
1.2
建立日期
2025-10-01
更新日期
2025-10-01
尺寸
9.4 KB
授權條款
MIT
腳本執行於

项目简介

  • 名称:B站视频增强:缩放、旋转、拖拽(Tampermonkey)
  • 版本:1.2
  • 作者:浮云里的浮云
  • 匹配页面:https://www.bilibili.com/video/*
  • 权限:GM_addStyle
  • 功能:在 B 站播放器底部控制栏新增缩放、旋转、拖拽与一键还原的控制。

主要特性

  • 缩放:范围 50%–200%,步进 10%,实时显示倍率(如 100%)。
  • 旋转:向左/向右每次 90°,角度实时显示(如 )。
  • 拖拽:按住视频区域拖动以移动画面(仅当倍率大于 100% 时启用)。
  • 还原:一键恢复到默认(倍率 100%、角度 、位置居中)。
  • 交互细节:平滑过渡动画、拖拽时指针显示抓取/抓紧。

安装方法

  • 安装 Tampermonkey(或兼容的用户脚本管理器)扩展。
  • 新建脚本,将完整代码粘贴并保存,确保脚本启用。
  • 打开任意 B 站视频页(https://www.bilibili.com/video/*),等待播放器加载完毕。
  • 控制栏左侧会出现自定义按钮区域,包含缩放、旋转与“还原”。

使用说明

  • 缩放:点击 + 放大、 缩小;中间显示当前倍率。
  • 旋转:点击 左转 90°、 右转 90°;角度显示在“还原”按钮角标。
  • 拖拽:在视频区域按住并拖动以平移画面;松开鼠标停止拖动。
  • 还原:点击“还原”将画面与状态重置。

快捷键(需聚焦非输入框)

  • Ctrl + Space:切换全屏。
  • Ctrl + + / Ctrl + = / Ctrl + ↑:放大。
  • Ctrl + - / Ctrl + ↓:缩小。
  • Ctrl + L / Ctrl + ←:向左旋转 90°。
  • Ctrl + R / Ctrl + →:向右旋转 90°。
  • Ctrl + 0:还原。

实现与行为说明

  • 控件插入:作为第一个子元素插入到 .bpx-player-control-bottom-center
  • 变换目标:对 .bpx-player-video-wrap 应用 translate/scale/rotate
  • DOM 变化兼容:使用 MutationObserver,当播放器结构发生变动时自动尝试注入控件。
  • 拖拽逻辑:仅在倍率大于 100% 时启用拖拽,避免误操作。

常见问题

  • 看不到按钮:刷新页面或等待播放器完全初始化;确认脚本处于启用状态且匹配到正确页面。
  • 无法拖拽:保证当前缩放倍率大于 100%;确认鼠标按在视频容器中。
  • 旋转或缩放异常:点击“还原”重置后再试。

兼容性与限制

  • 适配新版 B 站网页播放器。若 B 站更新 DOM 类名(尤其是控制栏或视频容器),功能可能暂不可用。
  • 本脚本仅影响网页端呈现,不修改视频源或页面其他逻辑。

脚本头(示例) 如果需要在 Tampermonkey 中显示元信息,可在脚本顶部补充如下头部:

// ==UserScript==
// @name         B站视频增强:缩放、旋转、拖拽
// @namespace    http://tampermonkey.net/
// @version      1.2
// @description  为B站视频添加缩放、旋转、拖拽移动和还原功能
// @author       浮云里的浮云
// @match        https://www.bilibili.com/video/*
// @icon         https://www.bilibili.com/favicon.ico
// @grant        GM_addStyle
// ==/UserScript==

注意

  • 若发现样式未生效,检查选择器是否为后代选择器,例如将 .resetBtn.bili-rotate-indicator 更正为 .resetBtn .bili-rotate-indicator,将 .bpx-player-container.bpx-player-video-wrap 更正为 .bpx-player-container .bpx-player-video-wrap

卸载

  • 在 Tampermonkey 的“已安装脚本”列表中禁用或删除即可。