JSFiddle - React, Tailwind, and code Playground
HTML
<object width="300" height="200" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0">
<param name="allowFullScreen" value="true" />
<param name="allowscriptaccess" value="always" /><param
name="src" value="http://www.youtube.com/v/8UFhdYhE9ko?version=3&hl=de_DE&wmode=opaque" />
<param name="allowfullscreen" value="true" />
<embed width="300" height="200" type="application/x-shockwave-flash" src="http://www.youtube.com/v/8UFhdYhE9ko?version=3&hl=de_DE" allowFullScreen="true" allowscriptaccess="always" allowfullscreen="true"/></object>
<object width="300" height="200" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0">
<param name="allowFullScreen" value="true" />
<param name="allowscriptaccess" value="always" /><param
name="src" value="http://www.youtube.com/v/8UFhdYhE9ko?version=3&hl=de_DE&wmode=opaque" />
<param name="allowfullscreen" value="true" />
<embed width="300" height="200" type="application/x-shockwave-flash" src="http://www.youtube.com/v/8UFhdYhE9ko?version=3&hl=de_DE" allowFullScreen="true" allowscriptaccess="always" allowfullscreen="true" wmode="opaque" /></object>
<div class="onTop">
CSS
.onTop {
width: 400px;
height: 500px;
position:absolute;
top: 0;
left: 0;
z-index: 100;
background: rgba(255,0,0,.5);
}
JavaScript
$("object").each(function() {
var $newObject = $(this).clone(true);
$newObject.children("embed").attr("wmode", "opaque");
$(this).replaceWith($newObject);
});