Photo by Sara Kurfeß / Unsplash

How to play video as popup while clicking on a button in html

Tips & Tricks Mar 3, 2023
.popup .popuptext {
visibility: hidden;
background-color: #555;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 8px 0;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -80px;
.popup .show {
visibility: visible;
-webkit-animation: fadeIn 1s;
animation: fadeIn 1s;
@-webkit-keyframes fadeIn {
from {opacity: 0;} 
to {opacity: 1;}
@keyframes fadeIn {
from {opacity: 0;}
to {opacity:1 ;}
<body style="text-align:center">
<div class="popup" onclick="myFunction()" ><button>Preview</button>
<video class="popuptext" id="myPopup" style="width:800px;" >
<source src="dolby-atmos-intro.mp4" type="video/mp4">
function myFunction() {
var popup = document.getElementById("myPopup");

if (popup.paused){; 


Error to 200

Error to 200 means "Error to Success Status". Through this blog and youtube channel, I attempt to teach basics and those coding techniques to people in a short time, which took me ages to learn.