Prevent html5 video from preloading in wordpress

Question

I have a wordpress page with lots of videos and would like to stop the preload with html5. I am inserting the videos with the featured media options. Therefore I cannot add the attribute preload="none" to my video-tag.

So I was trying to manage it with javascript, like:

function videoPreload () {
    document.getElementsByTagName('video').setAttribute('preload', 'none');
};
videoPreload();

But it doesn't work. I get the error, that this function does not exist. How can I add the relevant attribute to stop the videos from preloading?

Thanks so much!

Answer 1

The problem is that document.getElementsByTagName returns an array of all video elements.

I would change your code to either reference a single video

document.getElementsByTagName('video')[0].setAttribute('preload', 'none');

or add an id to your video element and reference that.

document.getElementById("myVid").setAttribute('preload', 'none');

Also, it's worth noting that the preload attribute does not work in Internet Explorer.