-
-
Notifications
You must be signed in to change notification settings - Fork 1.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
启用视频截图: 加入对网页全屏和全屏模式下播放器的支持 #3878
base: preview-fixes
Are you sure you want to change the base?
Conversation
2880d6d
to
cfec796
Compare
|
|
连续多次截图, 不希望列表挡住视频 |
理解,那么你觉得这个选项是默认启用还是禁用好呢? |
禁用吧 |
The screenshot container element was behind the player element in "webscreen" mode. CSS selector of the player element: `#bilibili-player.mode-webscreen`
cfec796
to
4d91572
Compare
我又回来更新了,测试了一下 2.x 的播放器是直接适配了的,可以正常使用,只是因为 2.x 界面的 header bar 高度和 3.x 不同(2.x: 56px, 3.x: 64px),导致截图列表在 2.x 界面的顶部会离 header bar 的底部多 8px,我觉得是可有可无了,如果追求完美确实可以改,就是不知道能不能直接在 CSS 里面区分 2.x 和 3.x 的界面。 另外关于不希望截图列表挡住视频,那么在网页全屏/全屏的情况下点击截图按钮或者按下快捷键后如何确认截图成功了呢?感觉还是得显示出来,如果觉得挡住可以直接点击保存或删除。 如果实在是不想视频被挡住(其实也就右边一点地方),还有两种方案供参考:
|
两种方案都不错, 或者也可以像调音量一样在播放器中间显示一个小提示, 看你喜欢哪种了 |
功能性上应该是 2 比较好,但是 1 实现起来比较简单(只需要改 CSS)。说到调音量,你对已知问题里的那一条有什么想法吗?我昨天看到有个组件是禁用滚轮调节音量的,或许可以参考一下实现?另外我发现在“稍后再看”播放页面这个组件本身就没有起作用,截图按钮都没显示,应该要修一下。 |
稍后再看那边原本是可以的, 只是最近 #3916 的缘故失效了 滚轮的问题可以看下 preventEvent(unsafeWindow, 'mousewheel', () => {
const isFullscreen = [
'player-mode-webfullscreen',
'player-fullscreen-fix',
'player-full-win',
].some(token => document.body.classList.contains(token))
return isFullscreen
}) 我估计阻止掉截图列表的 |
更改内容
z-index
使其能显示在网页全屏的播放器前面已知问题
.bpx-player-container
元素上的mouseenter
/mouseleave
监听器所触发,尝试在截图列表元素上对这两个事件使用event.stopPropagation()
阻止 bubble-up,但是并未达到期望中的效果,音量调整功能仍被触发。