PROSAGA码农传奇-webrtc-WebRTC：Safari阻止视频画中画？

<div class =“post-text”itemprop =“text”>
  
    我得到了这个工作。这是一个更新的CodePen。
  
  
    <a href="https://codepen.io/VikR/pen/Wgwwoa" rel="nofollow noreferrer">
      https://codepen.io/VikR/pen/Wgwwoa
    </A>
  
  
    关键是这个
     <code>
 overflow
 </code>
     视频容器中的代码：
  
   <pre>
 <code>
 #pipContainer {
 position: relative;
 width: 300px;
 height: 300px;
 border: 5px solid black;
 overflow: scroll;
 -webkit-overflow-scrolling: touch;
}

</code>
 </pre>
  
    这是一个艰难的追踪。谷歌搜索“safari z-index视频元素”显示许多人对此有困难，2011年至2018年的帖子出现在第一页的结果中。在其他情况下工作的许多修复程序在这种情况下似乎不起作用，可能是因为我将一个视频元素叠加在另一个视频元素之上。找到了有效的修复程序
    <a href="https://github.com/scottjehl/Device-Bugs/issues/14#issuecomment-5533973" rel="nofollow noreferrer">
      这里。
    </A>
  
  
    注1：
     <code>
 overflow: 'hidden'
 </code>
     也有效，并具有隐藏滚动条的额外好处。
  
  
    注意2：我的印象是可能无法通过javascript更改视频尺寸。在我的应用程序中，我目前通过引用将它们设置在HTML呈现中
     <code>
 screen.height
 </code>
    。
  
</DIV>