通过粘贴 Vimeo URL 嵌入的视频在移动设备上,视频上下有过多空白区域。
请在移动设备上访问以下 URL 以复现该问题:
https://try.discourse.org/t/testing-video-embeds/1369
截图:
通过粘贴 Vimeo URL 嵌入的视频在移动设备上,视频上下有过多空白区域。
请在移动设备上访问以下 URL 以复现该问题:
https://try.discourse.org/t/testing-video-embeds/1369
截图:
这里发生的情况是,我们的 iframe 标签具有固定的宽度和高度,而 Vimeo 嵌入的视频会调整为 100% 宽度,高度自动。
其他嵌入在 oneboxes 中的视频在开始播放后也会出现这种情况,但它们会预见到尺寸变化,因此会利用整个容器空间并设置黑色背景。
例如,这是 Dailymotion 的情况:
我想我们在这里能做的最简单的事情就是给 Vimeo 的 iframe 添加一个黑色背景?效果会像这样:
我们需要一个固定的高度,否则页面加载时布局会出现抖动……不确定我们是否可以/应该做一些更复杂的事情,比如确定宽高比并根据小屏幕调整尺寸(@techAPJ)?
好吧,暂时就用黑色背景吧。
Streamable 也出现了同样的问题。