We are closing.

Dm banner

SublimeVideoDocumentation

HD switching

SublimeVideo comes with an integrated HD switch which enables the viewer to toggle SD-HD video sources with a single click. It’s really easy to set up: all you need to do is add an additional <source /> element and set its data-quality attribute to hd.

Follow the examples below to get started.

Universal HD switching (MP4 and WebM)

<video class="sublime" width="640" height="360" poster="http://yoursite.com/video-poster.jpg" preload="none">
  <source src="http://yoursite.com/video.mp4" />
  <source src="http://yoursite.com/video_hd.mp4" data-quality="hd" />
  <source src="http://yoursite.com/video.webm" />
  <source src="http://yoursite.com/video_hd.webm" data-quality="hd" />
</video>

MP4-only HD switching

<video class="sublime" width="640" height="360" poster="http://yoursite.com/video-poster.jpg" preload="none">
  <source src="http://yoursite.com/video.mp4" />
  <source src="http://yoursite.com/video_hd.mp4" data-quality="hd" />
  <source src="http://yoursite.com/video.webm" />
</video>

Play HD first

<video class="sublime" width="640" height="360" poster="http://yoursite.com/video-poster.jpg" preload="none">
  <source src="http://yoursite.com/video_hd.mp4" data-quality="hd" />
  <source src="http://yoursite.com/video.mp4" />
  <source src="http://yoursite.com/video_hd.webm" data-quality="hd" />
  <source src="http://yoursite.com/video.webm" />
</video>

Note: If you switch sources in Flash mode, the player won’t remember the playback position and the video will restart from the beginning. If you use the Universal HD switching method described above you will almost never encounter this issue (except in old versions of Internet Explorer).