在Safari的预览缩略图中添加了“ vp-preview-invisible”类,但在Vimeo嵌入式视频中的Chrome中未添加该类

许多很多

我正在使用vimeo播放器在页面上嵌入视频。

由于某些原因,视频的缩略图vp-preview-invisible在Safari中具有该类(使该缩略图不可见),但是在Chrome中不存在该类(这使该缩略图可见)。

在此处输入图片说明

<div class="vp-preview vp-preview-cover" ... </div>

苹果浏览器

在此处输入图片说明

<div class="vp-preview vp-preview-cover vp-preview-invisible" ... </div>

这是我正在谈论的视频ID:326869440

我需要缩略图在Chrome和Safari中都可见。

我正在使用Version 12.0.1 (13606.2.104.1.2)Safari。

我该如何解决?

谢谢。

丽贝卡自己

@YaroslavTrofimov According to the site you linked I was able to see that you are using this to embed the player https://player.vimeo.com/video/326869440?autoplay=1&loop=1&title=0&byline=0&portrait=0.

I see the problem. It is the use of the autoplay=1 param. Autoplay has a lot of rules depending on the browser, some browsers handle it better and some handle it worse. Essentially, all browsers are now attempting to block UNMUTED Autoplay. (This is because users hated when they opened a site and audio would start playing out of nowhere.) They will allow your video to autoplay if it is muted though. So when you add muted=1 it will work. However this video has important audio content so you don't want to do that.

So what is the problem? When you use autoplay=1 the Vimeo player attempts to play it. However, the browser will interject and pause it moments later (because it doesn't allow autoplay with sound and it hasn't registered a user clicking play). When the Vimeo player attempts to play we always hide the thumbnail. The fact that it was paused by the browser, instead of a user clicking pause, is irrelevant and unknown to the player. The same way that when you click play and then later click pause, we don't show the thumbnail again. That is what is happening.

So you may wonder why Chrome and Safari differ. I think it's just a matter of how fast they detect your autoplay attempt and when they stop it. Because each browser is doing it on their own, we can't control that.

最后,如何解决?好吧,那很困难。最简单的解决方法是摆脱autoplay=1参数。如果您希望它能在可能的时候自动播放(在某些情况下某些浏览器会更宽容),那么您对Safari还是不太走运。

希望这能回答你的问题。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章