0

I have a banner with a video which is 4MB. The video is supposed to play from start.

Silly question:

What is the best way to load the Video?

Whereas I can preload assets such as images, do I also need to create a video javascript preloader?

I want the video to start playing when I begin animating the banner.

Any best practice?

  • "_I can preload assets such as images, do I also need to create a video JS preloader?_" Show some "preload" example code (images part) so we check if that logic can apply to video also. Otherwise I think you have to just load a video in tag and keep it hidden (use CSS layers, or dynamically set a small width & height. I never tried zero size but 1 pixel for each could work). Check video's load progress (via JS) & when it's ready then display the banner (dynamically change its CSS layer index or dynamically change width/height). Just an idea to try. Google any part you need. – VC.One Jul 07 '16 at 12:05
  • there's a couple of solutions here - http://stackoverflow.com/questions/18251632/another-force-chrome-to-fully-buffer-mp4-video/18294706#18294706 – Offbeatmammal Jul 07 '16 at 13:41

1 Answers1

0

If you are going to be doing more than just playing the video, then you should preload the video.

You could use canplaythrough to trigger your animations and play the video so they are synced.

https://developer.mozilla.org/en-US/docs/Web/API/HTMLVideoElement

pwynne
  • 13
  • 4