javascript 启用/禁用全屏选项 video.js HTML5
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21387993/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Enable/Disable fullscreen option video.js HTML5
提问by cjrodero
How can I enable/disable the fullscreen option of one video from my post tag HTML in Wordpress? I'm using Video.js.
如何从 Wordpress 中的帖子标签 HTML 启用/禁用一个视频的全屏选项？我正在使用Video.js。
I would not like to make it for ever, just decide which video I want with it or without it, anytime. I tried AllowFullScreen="true/false"but it doesn't work.
我不想永远做它，只要决定我想要哪个视频，无论有没有它，任何时候。我试过了，AllowFullScreen="true/false"但没有用。
回答by kudlohlavec
Current version of video-js (6.x.x) supports disabling of fullscreen button also by fullscreenToggleoption. You can simply set it during init of the player like this:
当前版本的 video-js (6.xx) 也支持通过fullscreenToggle选项禁用全屏按钮。您可以在播放器初始化期间简单地设置它，如下所示：
videojs("my-video", {
controlBar: {
fullscreenToggle: false
}
});
However, I observed that it doesnt mean that you are not able to enter fullscreen by hand gesture on mobile devices. (For example reverse pinch on iPad - two fingers on the screen and moving them apart). Thats another story - im dealing with it by listening for fullscreenchangeevent and checking isFullscreen()state of the player (fullscreenchange event triggers on opening but on closing of the fullscreen as well), if its in fullscreen then Im calling exitFullscreen()function. Just like this:
但是，我观察到这并不意味着您无法在移动设备上通过手势进入全屏模式。（例如在 iPad 上反向捏合 - 两个手指在屏幕上并将它们分开）。那是另一个故事 - 我通过监听fullscreenchange事件和检查isFullscreen()播放器的状态来处理它（fullscreenchange 事件在打开时触发，但在全屏关闭时触发），如果它是全屏的，那么我调用exitFullscreen()函数。像这样：
videojs("my-video",{controlBar: {fullscreenToggle: false}}).ready(function(){
myPlayer = this;
myPlayer.on("fullscreenchange", function(){
if(myPlayer.isFullscreen()){
myPlayer.exitFullscreen();
}
});
});
回答by Huey
Looking through the video.js documentation, getting the child component named FullscreenToggleis a pretty involved process. For me, only myPlayer.children()[5].children()[7]did the trick, where myPlayeris defined here:
查看 video.js 文档，命名子组件FullscreenToggle是一个非常复杂的过程。对我来说，只有myPlayer.children()[5].children()[7]诀窍，这里myPlayer定义的地方：
videojs("lodestar_video").ready(function(){
myPlayer = this;
});
However, calling .disable()and .disposed()didn't work and returned undefined.
但是，调用.disable()和.disposed()不起作用并返回undefined。
What worked for me was a CSS solution: making sure it doesn't appear using display:noneand then setting the appropriate margin so the volume control doesn't go out of place.
对我有用的是一个 CSS 解决方案：确保它不会出现使用display:none，然后设置适当的边距，这样音量控制就不会错位。
.vjs-fullscreen-control {
display: none;
}
.vjs-default-skin .vjs-volume-control {
margin-right: 20px;
}
The downside of this is the small overhead since the fullscreen button is still created and loaded, only not displayed, but this should be near-negligible in the light of loading an entire video.
这样做的缺点是开销很小，因为仍然创建和加载全屏按钮，只是不显示，但考虑到加载整个视频，这几乎可以忽略不计。
回答by Vaibhavraj S. Roham
Add class to video as below
将课程添加到视频中，如下所示
.vjs-nofull .vjs-fullscreen-control {
display:none;
}
to
.vjs-nofull .vjs-fullscreen-control {
display:none;
}
到
<video class="video-js vjs-default-skin vjs-nofull" ....></video>
<video class="video-js vjs-default-skin vjs-nofull" ....></video>
Hope it works
希望它有效
