JSFiddle - React, Tailwind, and code Playground

by Vitaliy

HTML

<h3>click on picture</h3>
<video poster="http://i.imgur.com/NDOYT4L.jpg">
  <source src="http://video.dailymail.co.uk/video/mol/2015/11/07/2829942071241294818/640x360_2829942071241294818.mp4" type="video/mp4">
</video>

CSS

video{
  display:block;
  width:300px;
  height:200px;
}

JavaScript

document.querySelector("video").onclick = function(){
	if(this.currentTime > 0 && !this.paused && !this.ended && this.readyState > 2){
  	this.pause();
    this.controls = false;
  }
  else if(this.paused){
  	this.play();
    this.controls = true;
  }
}