demo_iframe.htm

<!DOCTYPE html>
<html>
<head>
	<title>Hello</title>
	<meta charset="utf-8">
</head>
<body style="background-color: pink">

<h1>This page is displayed in an iframe</h1>

<div style="text-align: center;">
    <button onclick="playPause()">Play/Pause</button>
    <button onclick="makeBig()">Big</button>
    <button onclick="makeSmall()">Small</button>
    <button onclick="makeNormal()">Normal</button>
    <br><br>
	<video id="video1" width="420">
	   <source src="mov_bbb.mp4" type="video/mp4">
	   <source src="mov_bbb.ogg" type="video/ogg">
    </video>
</div>

<script>
	var myVideo = document.getElementById("video1");

	function playPause() {
		if (myVideo.paused)
			myVideo.play();
		else
			myVideo.pause();
	}
	function makeBig() {
		myVideo.width = 560;
	}
	function makeSmall() {
		myVideo.width = 320;
	}
	function makeNormal() {
		myVideo.width = 420;
	}
</script>

</body>
</html>