- { box-sizing: border-box; }
body { margin: 0; font-family: Arial; font-size: 17px; }
#myVideo { position: fixed; right: 0; bottom: 0; min-width: 100%; min-height: 100%; }
.content { position: fixed; bottom: 0; background: rgba(0, 0, 0, 0.5); color: #f1f1f1; width: 100%; padding: 20px; }
#myBtn { width: 200px; font-size: 18px; padding: 10px; border: none; background: #000; color: #fff; cursor: pointer; }
#myBtn:hover { background: #ddd; color: black; } </style>
<script> var video = document.getElementById("myVideo"); var btn = document.getElementById("myBtn"); function myFunction() { if (video.paused) { video.play(); btn.innerHTML = "Pause"; } else { video.pause(); btn.innerHTML = "Play"; } } </script>