Javascript DOM HTML Video preload Property set

Introduction

A demonstration of how to set different property values:

Click the buttons to create a VIDEO element, one with preload set to "none", and one with preload set to "auto".

The preload attribute is not supported in IE.

View in separate window 

<!DOCTYPE html>
<html>
<body>

<button onclick="myFunction('none')">Video without preload</button>
<button onclick="myFunction('auto')">Video with preload</button>
<br>

<script>
function myFunction(p) {
  var x = document.createElement("VIDEO");
  x.setAttribute("controls", "controls");
  var y = document.createElement("SOURCE");
  y.setAttribute("src", "video.mp4");
  y.setAttribute("type", "video/mp4");
  x.appendChild(y);/* w  w  w .  j  a  va 2s .  c om*/
  var z = document.createElement("SOURCE");
  z.setAttribute("src", "video.ogg");
  z.setAttribute("type", "video/ogg");
  x.appendChild(z);

  // Set the preload property:
  x.preload = p;

  document.body.appendChild(x);
}
</script>
</body>
</html>



PreviousNext

Related