javascript - "Hide"YouTube 视频的加载屏幕

标签 javascript jquery html youtube-api

在浏览了YouTube IFrame API之后,我一直找不到任何可以帮助我的东西。

我的目标是“隐藏”YouTube 视频的加载屏幕;即这个带有纺车的黑屏。虽然它只出现一秒钟并且不会打扰我,但在尝试使用 YouTube 作为元素的背景时却很麻烦。

YouTube video loading

我解决这个问题的方法是让 YouTube 视频第一帧的图片与视频重叠,然后在视频开始播放时隐藏它。我原本以为我可以使用 onStateChange 并观察 YT.PlayerState.PLAYING 值,这样我就可以隐藏图像,但是这个事件是在它即将到来时触发的开始演奏;换句话说,它会在视频即将开始播放时(即加载屏幕出现时)隐藏图像。

是否有任何其他方法可以解决这个问题,或者我是否停留在简短的加载屏幕上,或者自托管视频是否是更好的方法?由于带宽原因,我想避免自行托管视频。

最佳答案

将 iframe 容器的背景设置为黑色并将 iframe 不透明度设置为 0,一旦它开始播放将不透明度设置回 1

关于javascript - "Hide"YouTube 视频的加载屏幕,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29755250/

相关文章:

javascript - Svelte 冒泡排序可视化不会更新 dom

javascript - 窃取 oAuth2 中的访问 token

javascript - 谷歌地图无限线/增加长度或纬度lng计算

html - 元素不会在适当的位置从纵向切换到横向 ipad

html - 为什么在响应式网页设计中使用 HTML5?

javascript - 如何动态创建具有不同 ID 的输入元素?

javascript - javascript能区分破折号吗?

Javascript 粘性菜单问题

javascript - 克隆没有值的文本字段

jquery - 将 <tr> 设置为一个 block 会在同一列中显示 <td> 的内容