Question

我使用`iframe导入了YouTube视频，但它不能在移动设备上运行，但在桌面上运行完美。

通过不工作，我的意思是：视频在触摸时不会开始播放，如果它被双击，页面会放大。

代码：

div#video
    iframe(src = 'https://www.youtube.com/embed/mfB19N3ZdS0' frameborder = '0', allowfullscreen = '')

Answer 1

<强>更新

查看您提供的网页链接，问题是您有一个覆盖视频的DIV，意味着无法点击播放按钮。它只发生在浏览器很窄的时候，这就是为什么你只能在移动设备上看到它。它似乎也是特定的野生动物园，这使得它更难找到。

如果你看一下带有id＆＃34; divesRight＆＃34;的div。在使用开发人员工具和连接的iPhone的iOS检查器中，或者在Mac上使用浏览器减少到单个列宽的Safari中，您将看到div位于视频顶部，因此您无法点击播放按钮：

如果您在浏览器检查器中删除此div，则视频可在iOS设备上正常播放。

我将原来的答案保留在下面，因为当我第一次看时它肯定是一个问题并且它可能对某人有帮助 - 它现在似乎没有给出SME内容错误，因为它显然不是中小企业视频。也许这只是对他们的盗版检查的误报。

下面的示例HTML对于检查很有用，因为这绝对可以在浏览器中使用（据我所见......）。

原始回答

假设HTML语法正确（我认为上面的摘录是简写？）我认为问题可能出在您使用的特定视频上，内容所有者似乎限制在某些设备上（在这种情况下为SME））。

例如，如果您尝试在Mac上的Chrome上直接播放，则会收到以下消息：

使用W3schools的简单示例，在iPhone上播放视频可以准确呈现您描述的行为。

使用其他示例视频（我在Google YouTube示例中尝试了一个视频），播放效果很好。

以下是YouTube示例视频的示例代码：

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

<iframe id="player" type="text/html" width="640" height="390"
  src="http://www.youtube.com/embed/M7lc1UVf-VE?enablejsapi=1&origin=http://example.com"
  frameborder="0"></iframe>

</body>
</html>

Answer 2

向display: block添加iframe解决了我的问题

iframe视频在触摸时无法在手机上播放

2 个答案: