嵌入视频全屏崩溃并重新载入页面

Question

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

Answer 1

我找到了这个问题的原因。在其中一个Wordpress主题文件中有一个函数正在重新加载窗口大小调整页面，当将视频放在全屏模式下时会触发这个功能。我只是拿出这个代码，因为它不是我的网站所必需的。

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