Is it possible to show subtitles on an HTML5 video control in fullscreen mode?
I can show them (for example on FF 11.0) in window mode, with a slightly modified version of cuepoint.js to show "live" subtitles:
Cuepoint.prototype.addLiveSlide = function(html) {
var self;
this.html = html;
self = this;
return this.video.addEventListener("timeupdate", function() {
return self.update(html);
},
false);
};
But , when user goes fullscreen, subtitles do not show... When back to window mode, they do show again.
Is this behaviour by design, a bug, or do I miss something?
could you do some magic involving Video and Canvas? http://html5doctor.com/video-canvas-magic/
I suggest trying playr which supports full screen (apparently - I've not actually tested that part of it myself).
firefox's native fullscreen-mode (using the fullscreen-api) hides everything but the element you requested fullscreen for regardless of z-index's. the solution is quite easy though: wrap a container-div around the video and other content (such as the subtitles) and request fullscreen for that container instead.
the problem does not occur in chrome which respects z-index-values at any time
In Chrome works out of the box
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.