JSFiddle - React, Tailwind, and code Playground

HTML

<embed src="http://ia600204.us.archive.org/2/items/Pbtestfilemp4videotestmp4/video_test.mp4" width="300" height="200" controller="true" wmode="transparent" autoplay="true" scale="tofit" />

<div id="overlay">Overlay Div</div>

<iframe src="javascript:void(0)" id="ifrm" frameborder="0" style="display:none;"></iframe>

CSS

body{
    /*background:#ccc;*/
}
div
{
    background:yellow;
    position:absolute;
    height:50px;
    width: 200px;
    top:20px;
    left:20px;
    zIndex: 100;
}

JavaScript

$(function(){
    var $overlay = $("#overlay");
    $("#ifrm").css({
        width: $overlay.outerWidth(),
        height:$overlay.outerHeight(),
        top: $overlay.offset().top,
        left: $overlay.offset().left,
        zIndex: (parseInt($overlay.css("zIndex")) - 1),
        position: "absolute"
    }).show();
});