Is there a way to lay a div tag on top of a YouTube iframe for full-screen?
I was able to lay a div tag on top of a YouTube iframe with the following code:
<html>
<head></head>
<body>
<div style="position:relative">
<iframe width="560" height="315" src="https://www.youtube.com/watch?v=tQ0yjYUFKAE" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<div style="position:absolute;top:0px;left:0px;background:#000;width:500px;height:500px;"></div>
</div>
</body>
</html>
But when YouTube iframe above is full-screen, the added div tag disappears.
Please let me know if there is a way to solve this problem.