HTML5视频导致页面在Safari 10上跳转

Question

当我的页面在大约5秒钟后加载后，窗口滚动到一个html视频，这是一个非常重要的方式（在自动播放时）。这是Safari 10发布后的一个问题。任何人都知道为什么会出现这种情况？

Answer 1

我有同样的问题 - 如果我删除自动播放属性它不会发生。

通过JS启动自动播放（甚至可以从控制台启动视频）也会使页面跳转。

Answer 2

它是在HTML中的“控制”的属性，我发现，在Safari上新的更新是给几个问题，看看这个：https://stackoverflow.com/questions/42692679/video-tag-on-safari-10-goes-up-after-few-seconds

我没有重现您的问题（与矿混合，上的jsfiddle这个问题）： https://jsfiddle.net/antonino_R/d9tf0va3/15/ （向下滚动，然后再次运行重现该问题，您可能需要运行，并再次快速向下滚动）

和消除“控制”不解决这个问题https://jsfiddle.net/antonino_R/d9tf0va3/16/

<div class="wrapper"> 
    <div class="wrapper-inner"> 
    <div class="wrapper-video"> 
     <video autoplay loop muted > 
     <source src="http://techslides.com/demos/sample-videos/small.mp4" type='video/mp4;codecs="avc1.42E01E, mp4a.40.2"'/> 
     </video> 
    </div> 
    <div class="site-centered clearfix"> 
      <header class="entry-header"> 
      <h1 class="entry-title">this is a title</h1> 
      <h2 class="entry-subtitle">this is some text</h2> 
      </header> 
    </div> 
    </div> 
</div> 

<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<h4>this is to scroll down the page and test that it goes up after few seconds</h4> 

很明显，如果需要的控件此修复程序是不够的

Answer 3

好首先，你必须添加这段代码在页脚：

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

这为我工作。之前我有问题，5秒后当网站加载，只是跳到有视频背景的部分。我在那里覆盖图像，没有价值min-height：___px;覆盖比视频高度短。