0

我有一个自定义 HTML5 视频播放器，在 HTML 页面中有一个视频标签和另一个 DIV 标签，我在其中放置了控件。控制 DIV 有播​​放按钮、暂停按钮、全屏按钮等。现在我正在尝试通过单击全屏按钮使视频全屏显示。我已经编写了使用 requestFullscreen() 的代码。此代码没有抛出任何错误，但它既不工作。有人可以告诉我哪里出错了吗？

var controls = {
video: $("#player"),  //this is the video element
fullscreen: $("#fullscreen")  //This is the fullscreen button.
};

controls.fullscreen.click(function(){
var elem = controls.fullscreen;
if (elem.requestFullscreen) {
    controls.video.requestFullscreen();
} else if (elem.mozRequestFullScreen) {
    controls.video.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
    controls.video.webkitRequestFullscreen();
}
});
4

1 回答 1

4

controls.fullscreen并且controls.video都是 jQuery 对象，而不是 DOM 元素。您想要 jQuery 对象中的元素，您可以通过以下方式获得.get：

var controls = {
    video: $("#player").get(0),  //this is the video element
    fullscreen: $("#fullscreen").get(0)  //This is the fullscreen button.
};

jQuery 对象没有requestFullscreen属性，因此您的if语句都没有运行（如果它们已经运行，则将video.requestFullscreen失败）。

于 2013-05-02T01:54:11.960 回答