制作html5视频到全屏

Question

我有一个custome 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(); 
} 
}); 

Answer 1

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沃尔德失败了）。