Chrome / Safari HTML5 视频全屏模式无法正常工作答案

【问题标题】：Chrome / Safari HTML5 Video Fullscreen Mode not working properlyChrome / Safari HTML5 视频全屏模式无法正常工作
【发布时间】：2015-07-01 20:26:40
【问题描述】：

我已经在我的网站中实现了 Video.js 播放器，但是 Chrome 和 Safari 存在一个小问题。视频播放器的父级附加了一个position relative 属性，因此全屏模式会将视频对齐到其父级的左侧和顶部。就好像我要将视频播放器设置为position: absolute; top: 0; left: 0;。这只发生在 Chrome 和 Safari 中，而不是在 Firefox 中。有人遇到过这个问题吗？

【问题讨论】：

标签： javascript css html google-chrome

【解决方案1】：

我注意到容器有一个关键帧动画，而这最终成为了问题！我有一个默认加载的淡入淡出动画，这显然导致了问题。通过删除 animation 属性，它开始在 safari 和 chrome 中工作。不幸的是，我不知道为什么。

【讨论】：