Zembedowane video w HTML.

([-] konieczne stała wartość width albo height)

<video id="twojeID" class="video-js vjs-default-skin vjs-paused vjs-controls-enabled" controls preload="none" 
poster="ścieżka/do/postera.jpg" width="100%" height="500px"  data-setup='{"example_option":true}'>
	<source src="ścieżka/do/video.mp4" type="video/mp4"/>
	<source src="ścieżka/do/video.webm" type="video/webm"/>
	<source src="ścieżka/do/video.ogv" type="video/ogv"/>
		<p class="vjs-no-js"> Aby wyświetlić to video odblokuj JavaScript, i/lub rozważ aktualizację swojej przeglądarki do <a href="http://videojs.com/html5-video-support/" target="_blank"> wspierającej HTML5 video</a></p></video> 

Dynamiczne video w HTML.

+ Dodaj video

HTML:

<p><button type="button" class="btn btn-lg btn-primary">Dodaj video</button></p>
<pre class="prettyprint lang-html"></pre>
<div id="sVideo">
</div> <!-- video --> 

JavaScript:

// zabezpieczenie przed wrzuceniem więcej niżjednego video
var counter = 0;
	
$(".btn-lg").on("click",function(){
if(!counter){
	var dynamicVideo = document.createElement("video");		
	dynamicVideo.setAttribute("id","dynamicVideo");
	dynamicVideo.setAttribute("class","video-js vjs-default-skin vjs-paused vjs-controls-enabled");
			
	var mp4src = document.createElement("source");
		mp4src.src = "vid/Wildlife.mp4";
		mp4src.type = "video/mp4";
	var webMsrc = document.createElement("source");
		webMsrc.src = "vid/Wildlife.webm";
		webMsrc.type = "video/webm";
	var ogVsrc = document.createElement("source");
		ogVsrc.src = "vid/Wildlife.ogv";
		ogVsrc.type = "video/ogv";
			
	var noJs = document.createElement("p");
		noJs.setAttribute("class","vjs-no-js");
	var noJsMessage = document.createTextNode("Aby wyświetlić to video odblokuj JavaScript, i/lub rozważ aktualizację swojej przeglądarki do ");
	noJs.appendChild(noJsMessage);
		
	var videoSupportLink = document.createElement("a");
		videoSupportLink.setAttribute("href","http://videojs.com/html5-video-support/");
		videoSupportLink.setAttribute("target","_blank");
	var linkContent = document.createTextNode("wspierającej HTML5 video");
			
	videoSupportLink.appendChild(linkContent);
	noJs.appendChild(videoSupportLink);
			
	dynamicVideo.appendChild(mp4src,webMsrc,ogVsrc);
	var targetDiv = document.getElementById('sVideo');
	targetDiv.appendChild(dynamicVideo,noJs);
			
	videojs("dynamicVideo", { 
			"controls" : true,
			"preload" : "none",
			"poster" : "vid/Wildlife.jpg",
			"width" : "100%",
			"height" : "500px"}, function(){
	  // Odtwarzacz (this) jest zainicjowany i gotowy do pracy.
	});
}
else{
	console.log("Jest już na stronie dynamiczne video!");
}
counter = 1;
});