Firefox 3.6 视频全屏控制

发布于 2024-10-02 20:53:47 字数 542 浏览 3 评论 0原文

Firefox 现在支持视频 html5 标签的全屏模式。（右键单击电影..）

有什么方法可以创建一个控件（html标签）来执行此操作，就像这个播放/暂停示例（使用js）？

<script>
function play(){
var video = document.getElementById('movie');
var play =  document.getElementById('play');

play.addEventListener('click',playControl,false);
function playControl() {
    if (video.paused == false) {
        video.pause();
    this.firstChild.nodeValue = 'Play';
    pauseCount();
} else {
    video.play();
    this.firstChild.nodeValue = 'Pause';
    startCount();
}
}
}

原文

Firefox now supports full screen mode on the video html5 tag. ( right click on the movie .. )

Is there any way to create a control ( html tag ) to do this like this play/pause example ( using js ) ?

<script>
function play(){
var video = document.getElementById('movie');
var play =  document.getElementById('play');

play.addEventListener('click',playControl,false);
function playControl() {
    if (video.paused == false) {
        video.pause();
    this.firstChild.nodeValue = 'Play';
    pauseCount();
} else {
    video.play();
    this.firstChild.nodeValue = 'Pause';
    startCount();
}
}
}

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

旧梦荧光笔 2024-10-09 20:53:47

基本上，您需要的只是创建一个函数（由全屏按钮触发），在其中为视频包装器指定一个位置：绝对和更高的 z 索引

，您将指定视频和视频包装器的宽度和高度：100%（或固定大小（如果您愿意）

可能实现此行为的最佳方法是定义一个类（例如全屏）并将其分配给容器，就像

.fullscreen {
   position : absolute;
   z-index  : 1000;
   width    : 100%;
   height   : 100%;
   top      : 0;
   left     : 0;
}

.fullscreen video {
   width    : 100%;
   height   : 100%;
}

函数调用（全屏/普通视图）是 的开关.fullscreen 类。

basically all you need is creating a function (triggered by a fullscreen button) in which you assign a position: absolute, and an higher z-index to the video wrapper

the you will assign both video and video wrapper width and height : 100% (or fixed size if you prefer)

probably the best way to achieve this behaviour is defining a class (e.g. fullscreen) and assign it to the container, something like

.fullscreen {
   position : absolute;
   z-index  : 1000;
   width    : 100%;
   height   : 100%;
   top      : 0;
   left     : 0;
}

.fullscreen video {
   width    : 100%;
   height   : 100%;
}

so the function call (fullscreen/normal view) is a switch for the .fullscreen class.

回复收藏 0 原文

~没有更多了~