css - 如何仅在移动版本中停止 youtube 视频自动播放?

标签 css video youtube youtube-api

我在网站上使用 YouTube 视频 here

我已将视频设置为在主页上自动播放。在响应式移动版本(分辨率低于 767px)中,我使用 css display none 隐藏了视频。但视频仍在后台播放。

我这样做是因为我想在移动版中改变视频的位置,所以我在移动版中隐藏了右侧边栏视频并显示了左侧视频。

现在我想在隐藏时停止移动版本的视频。但是即使使用 css 隐藏视频,视频仍在播放。我知道 css 不能阻止 iframe 自动播放。

有没有什么方法可以根据屏幕的分辨率关联youtube视频的自动播放。这样我们就可以根据屏幕的分辨率播放和停止视频。

最佳答案

只需使用 Javascript 根据屏幕分辨率动态 加载 youtube 视频嵌入 url,而不是使用静态视频 url p>

这个 link 可能有助于检测屏幕分辨率。

如果您觉得屏幕尺寸小,只需从 url 中删除 youtube 自动播放参数

编辑:检查这个 url 用于动态屏幕尺寸处理

关于css - 如何仅在移动版本中停止 youtube 视频自动播放?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28336433/

相关文章:

html - 具有后备功能的响应式 <picture> 图片

css - Extjs4 多组 header value css

php - 如何通过mplayer或ffmpeg将视频拍照转php?

opencv - 在OpenCV中处理视频,无需播放

javascript - 无法停止隐藏 DIV 中的 YouTube 视频在后台播放

css - 悬停时文本周围的灰色框状轮廓

javascript - 如何使用颜色选择器作为 HTML 输入元素

python - 将 Pygame 模拟保存为 mp4 文件

java - 从我的 android 应用程序打开 youtube 应用程序。如何传递id?

python-3.x - 抓取所有 youtube 搜索结果