嵌入式视频在全屏时崩溃并重新加载页面

Question

我正在使用 iframe 在我的网站上嵌入 YouTube 视频。我包括了 allowfullscreen 属性。在我的网站上，嵌入的视频可以正常播放，直到我单击“全屏”按钮。当它切换到全屏时，视频将以全屏模式短暂显示，然后立即关闭并刷新页面。在 Firefox 中不会出现此问题。它确实发生在其他浏览器中，例如 Edge 和 Chrome。当我在浏览器中检查时，控制台中没有错误。我已经对 YouTube 和 Vimeo 视频进行了测试，并且出现了同样的问题。我尝试使用对象标签而不是 iframe 嵌入，但得到了相同的结果。有什么想法可能导致这种情况吗？

Answer 1

我找到了这个问题的原因。一个 Wordpress 主题文件中有一个函数在调整窗口大小时重新加载页面，当将视频置于全屏模式时会触发该函数。我只是取出了这段代码，因为我的网站不需要它。

 var initialWidth = $(window).width();
$(window).resize(function()
{
    var currentWidth = $(window).width();
    if( initialWidth !== currentWidth)
    {
        location.reload();
    }
});