Netbeans不会加载html5视频

Netbeans wont load html5 video

本文关键字：html5 视频 加载 Netbeans      更新时间：2023-09-26

我有一个HTML5网页，有一个全屏视频背景。

当我试图通过Windows中的文件夹点击.html文件来运行网页文件时，没有问题。

但是，当我尝试在Netbeans中使用Web服务器将其作为HTML或PHP项目运行时，视频播放一次，然后停止播放，同时它具有循环的特性。当我通过窗口打开.html文件时，循环确实有效。

在一些视频上，它甚至没有加载整个视频，但视频控件是存在的。但屏幕一直是黑色的。

是我的代码导致了这个问题吗？或Netbeans应用程序。

这是我的HTML代码：

<!DOCTYPE html>
<html>
    <head>
        <title>My site</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link href="css/style.css" type="text/css" rel="stylesheet">
        <link href="css/plugins.css" type="text/css" rel="stylesheet">
        <script src="js/jquery.js" type="text/javascript"></script>
        <script src="js/main.js" type="text/javascript"></script>
    </head>
    <body>
        <div class="fitScreen">
            <div class="loading"></div>
            <div class="mainContent">
                <video preload="auto">
                    <source src="sample.mp4" type="video/mp4">
                </video>
                <div id="logo"></div>
            </div>

        </div>
    </body>
</html>

和CSS：

@import "reset.css";
html, body {
    height: 100%;
    width: 100%;
    font-family: Arial;
    overflow-x: hidden;
}
.fitScreen {
    position: relative;
    z-index: 0;
    height: 100%;
    background-color: black;
}
.mainContent video {
    display: none;
    position: fixed;
    z-index: 2;
    height: auto;
    width: auto;
    min-height: 100%;
    min-width: 100%;
}

还有一点预加载程序的javascript：

$(window).load(function() {
    $('.loading').animate({'opacity': '50%'}, 1500, function() {
        $('.loading').fadeOut('fast');
        $(".fitScreen video").prop('muted', true); //mute
        setTimeout(function() {
            $('.fitScreen video').fadeIn(2000);
            $('.fitScreen video').get(0).play();
        }, 250);
        $('#logo').delay(500).fadeIn(2000);
    });
});

我目前正在使用Netbeans 8。

我假设您正在NetBeans的嵌入式服务器上运行该项目？如果是这样，请尝试在Chrome中运行它(像往常一样从NetBeans运行(，打开Chrome Developer Tools，使用F5重新加载页面，然后切换到Chrome Developer Tools中的"网络"选项卡，并检查带有视频记录的行的"类型"列。应该有类似video/mp4或video/[something]的东西。嵌入式服务器可能不支持这种mime类型。如果是这种情况，请查看此链接http://forums.netbeans.org/topic58110.html有一些变通方法可以启用它。

相关文章：