如果html5视频位于视口之外，则无法在OSX Safari中自动播放 [英] html5 video does not autoplay in OSX Safari if positioned outside the viewport
问题描述
我正在尝试在网页上自动播放和内嵌html5视频.这在所有浏览器和所有设备(某些Android设备除外)上均能正常工作.但是，如果将视频放在页面的下部(视口之外)并向下滚动到它，则该视频将无法在OSX Safari(版本11)中自动播放.其他浏览器(如Firefox和Chrome)没有显示此问题.
I´m trying to autoplay and inline an html5 video on a web page. This works fine in all browsers and all devices (except for some Android devices). However, if you place the video on the lower parts of the page (outside the viewport) and scroll down to it, the video does not autoplay anymore in OSX Safari (version 11). Other browsers like Firefox and Chrome don´t show this problem.
当您向下滚动以使视频可见并刷新页面时，该视频将自动播放.
When you scroll down, having the video visible, and refresh the page, the video will autoplay however.
<video id="videoheader" playsinline autoplay="autoplay" muted loop data-flashblockwhitelisted="true" poster="posterimage.jpg">
<source src="video.mp4">
</video>
该网站仍在开发中(并且尚未在线)，但是也显示此问题的页面的一个很好的例子是:
The website is still in development (and not online yet), but a good example of a page which shows this problem too, is:
该视频位于页面下部，不会在Safari中自动播放.
The video's in the lower parts of the page, won´t autoplay in Safari.
Apple似乎已在视口外禁用了html5视频的自动播放功能.在旧版的Safari(版本6.1.6)中，它表现良好.
It seems that Apple has disabled autoplay feature for html5 video outside the viewport. In older versions of Safari (version 6.1.6) it performed well.
任何建议或代码示例如何解决此问题?
Any suggestions or code examples how to get around this problem?
推荐答案
您的视频似乎已自动播放并被静音了-在Safari的更高版本之一中已经解决了一个已知问题，该问题可以解决此问题[我的粗体] :
It looks like your video is autoplay and muted - there is a known issue which is addressed in one of the later Safari release which may addresses this [my bolding]:
媒体
- 实施onencrypted事件的HTMLMediaElement
- 固定的自动播放的静音视频不在视口中播放
- 修复了HTMLTrackElement行为以符合标准
有关预览版本的更多信息，请点击此处: https://developer. apple.com/safari/technology-preview/release-notes/
More info on the preview releases here: https://developer.apple.com/safari/technology-preview/release-notes/
您可以在此处下载预览版本，以验证是否可以解决您的问题: https://developer .apple.com/safari/download/
You can download the preview releases here to verify if this solves your issue: https://developer.apple.com/safari/download/
这篇关于如果html5视频位于视口之外，则无法在OSX Safari中自动播放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
