Question

我用不同的按钮在javascript中制作了一个视频播放器。现在我想在我的javascript中添加一个对象，它将提供有关视频播放方式的信息。如果正在播放，如果它正在暂停，或者它是以慢动作播放的话。例如。

我的代码如下所示：

var doThings = function (n) { 'use strict';

    if (n === 1) {
        document.getElementById('video').play();
    }

    if (n === 2) {
        document.getElementById('video').pause();
    }
};
var volume = function (n) { 'use strict';

    if (n === 1) {
        document.getElementById('video').muted = true;
    }

    if (n === 2) {
        document.getElementById('video').muted = false;
    }
};
var fullscreen = function() { 'use strict'; if (video.requestFullscreen) { video.requestFullscreen();

    } else if (video.webkitRequestFullscreen) {
        video.webkitRequestFullscreen();
    }
};
var slowmotion = function (n) { 'use strict';

    if (n === 1) {
        document.getElementById('video').playbackRate = 0.5;
    }
};
var normalspeed = function(n) { 'use strict';

    if (n === 1) {
        document.getElementById('video').playbackRate = 1;
    }
};

我想添加一个对象，该对象将指示当前正在使用的媒体播放器的哪个功能。我可以使用console.log（），但我希望信息显示在正在播放电影的窗口中。

Answer 1

HTML：

<div id="Display"></div>

每个函数中的Javascript：

document.getElementById("Display").innerHTML("Function Being Used");

使用CSS在任意位置定位和设置元素，包括在视频顶部。不确定特定用例的布局，但您可以调整z-index和堆栈顺序以将div放置在与视频相关的任何位置。

可能无法在全屏模式下工作。

用javascript在视频中显示信息

1 个答案: