Video-Sample: Elephants Dream © copyright 2006 Blender Foundation - Netherlands Media Art Institute

HTML5 <video> switching example

Due to the build-in functionality of LeanBack Player we are able to switch directly between different media objects. This page shows an example of how to make such use-cases work and also provides the necessary source-code without the need to use a 3rd party javascript library.

click to load video
./videos/360p/big_buck_bunny_640x360_2.28.mp4,./videos/360p/big_buck_bunny_640x360_2.28.webm,./videos/360p/big_buck_bunny_640x360_2.28.ogv
Video-Sample: Big Buck Bunny © copyright 2008 Blender Foundation
Click to load video
click to load video and subtitles
./videos/360p/sintel_640x360_2.28.mp4,./videos/360p/sintel_640x360_2.28.webm,./videos/360p/sintel_640x360_2.28.ogv
kind:subtitles|label:Deutsch|srclang:de|type:text/x-srt|src:./subtitles/sintel/german_de.srt||kind:subtitles|label:English|srclang:en|type:text/x-srt|src:./subtitles/sintel/english_en.srt||kind:subtitles|label:Español|srclang:es|type:text/x-srt|src:./subtitles/sintel/spanish_es.srt||kind:subtitles|label:Français|srclang:fr|type:text/x-srt|src:./subtitles/sintel/french_fr.srt||kind:subtitles|label:Pусский|srclang:ru|type:text/x-srt|src:./subtitles/sintel/russian_ru.srt
Video-Sample: Sintel a DURIAN open movie project © copyright Blender Foundation
Click to load video and subtitles
click to load multi-source video
./videos/360p/elephants_dream_640x360_2.30.mp4,./videos/480p/elephants_dream_856x480_2.30.mp4,./videos/720p/elephants_dream_1280x720_2.30.mp4,./videos/360p/elephants_dream_640x360_2.30.webm,./videos/480p/elephants_dream_856x480_2.30.webm,./videos/720p/elephants_dream_1280x720_2.30.webm,./videos/360p/elephants_dream_640x360_2.30.ogv,./videos/480p/elephants_dream_856x480_2.30.ogv,./videos/720p/elephants_dream_1280x720_2.30.ogv
Video-Sample: Elephants Dream © copyright 2006 Blender Foundation - Netherlands Media Art Institute
Click to load multi-source video