Question

遇到safari的问题。出于某种原因，视频会在视频下消失，直到您将鼠标悬停在应有的位置。一旦你这样做它就会弹出并正常工作。为了复制它，让页脚不在视图中，然后重新加载页面，或者单击一个页面并单击返回主页。

使用所有浏览器在多台Mac（使用1080p显示器，Macbook Air和Macbook Pro的MacPro）上进行测试，视频在Opera，Chrome，Firefox甚至IE（平行）中运行良好，但不适用于Safari。 Windows机器使用所有浏览器Chrome，Firefox，Opera和IE都没有问题。

视频背景正在构建到WordPress网站上，使用下划线作为我正在构建的主题的基础。

以下网址是什么让我适合。

http://yokellocalhosting.com/freddy/

以下是我在HTML中进行背景设置的方法：

<?php if(is_front_page() ) { ?>
    <div id="videoContainer">
        <video autoplay loop id="videoBackground" preload="auto">
            <source src="http://yokellocalhosting.com/freddy/wp-content/uploads/2014/03/Fabulous_Freddys_Background_MP4.mp4" type="video/mp4" />
            <source src="http://yokellocalhosting.com/freddy/wp-content/uploads/2014/03/Fabulous_Freddys_Background_OGG.ogg" type="video/ogg" />
            <source src="http://yokellocalhosting.com/freddy/wp-content/uploads/2014/03/Fabulous_Freddys_Background_WEBM.webm" type="video/webm" />
        </video>
    </div>
<?php } ?>

以下是相关的CSS：

#videoContainer{
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 9;
    width: 100%;
    height: 100%;
}
#videoBackground{
    position: relative;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 9;
}

我知道我有正确的服务器设置MIME类型。只是无法弄清楚问题是什么以及它为什么要这样做。

HTML5视频背景和Safari不能玩得很好

0 个答案: