我正在构建一个自定义的html5-mediaplayer。我使用自定义控件,因此在创建媒体元素(使用JS)时,我首先将其设置为controls = false;。在全屏播放视频时,我想将控件的值更改为true,以便它们仅在全屏模式下显示。但是,该对象保持为假。设置后,似乎无法更改控件。
我想念什么吗?如何更改该值?我尝试过的所有其他浏览器(Chromium,Opera,Safari和Linux-MacOS)都做得很好。我发现的所有文档都说,这应该可行。
有问题的代码是这样,都无法正常工作:
function fullscreen()
{
document.getElementById("cbPlayer_fullscreen").blur(); //fullscreen-button
var currentMedia = document.getElementById(currentMediaId);
currentMedia.removeAttribute("controls");
//currentMedia.controls = true;
currentMedia.setAttribute("controls","controls");
// go full-screen
if (currentMedia.requestFullscreen) { currentMedia.requestFullscreen(); }
else if (currentMedia.msRequestFullscreen) { currentMedia.msRequestFullscreen(); }
else if (currentMedia.mozRequestFullScreen) { currentMedia.mozRequestFullScreen(); }
else if (currentMedia.webkitRequestFullscreen) { currentMedia.webkitRequestFullscreen(); }
}
控制台中没有错误。
感谢您的提示!
克里斯
...哦,您可以在这里狂野地看到这件事:https://musicchris.de/?page=media
最佳答案
更改您的html以实际调用fullscreen()函数:
<a onclick="fullscreen()" class="cbPlayer_fullscreen" href="javascript:">
<img style="box-shadow: 0px 0px 2px 1px gray;" id="cbPlayer_fullscreen" class="cbPlayer_mediacontrols cbPlayer_fullscreen" src="cbplayer/pics/fullscreen.png" alt="fullscreen" title="fullscreen">
</a>
我还建议您将js移到单独的文件中:)