防止在iPhone上加载HTML5视频

Question

我想加载视频以在台式机和平板电脑上播放，但阻止加载到iPhone上，因为它只是一个图形元素。

这里是我的代码：

<video width="980" height="400" poster="/poster.jpg" autoplay loop> 
<source src="/images/front.mp4" type="video/mp4"> 
<source src="/images/front.webm" type="video/webm"> 
Your browser does not support the video tag. 
</video> 

我怎么能告诉iPhone手机无法加载视频，但只显示海报框​​架？

谢谢。

Answer 1

像这样的东西应该工作：

<script> 
var videoElement = document.getElementsByTagName("video")[0]; 

if ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) { 
    videoElement.parentNode.removeChild(videoElement); 
    videoElement.pause(); 
} 
</script> 

这里假设你只需要在页面上一个video元素。

此外，请务必在关闭body元素之前放置JavaScript，或将其放入外部JavaScript文件中。