JSFiddle - React, Tailwind, and code Playground
HTML
<iframe id="ifr" src="http://garage.invoicebus.com/wp-content/uploads/2012/02/Invoice-Template.pdf" scrolling="no"
width="1000" height="800" frameborder="0" class="frame-pdf"></iframe>
<div id="pnlSpecialInstructions" class="modalPopup" style="z-index: 100001; display: block; position: absolute;
left: 432px; top: 281.5px;">
<div id="innerPanelSplInstructions" class="modalPopup" style="z-index: 100; position: absolute">
<div id="pnlSpecialInstructionsDragHandle" style="height: 25px; vertical-align: middle;
cursor: move; background-color: #DDDDDD; border: solid 1px Gray; color: Black;
text-align: center;">
<b>Special Instructions Listing</b>
<input type="image" name="imgBtnSplInsClose" id="imgBtnSplInsClose" src="images/reject.png"
align="right" />
</div>
<br/>
<table width="100%" id="rptableInboxList" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<th width="29%" height="32" align="left" valign="middle" bgcolor="#085990" class="insideheading">
Date & Time
</th>
<th width="71%" align="left" valign="middle" bgcolor="#085990" class="heading">
Spl Instructions
</th>
</tr>
<tr align="left" valign="middle">
<td height="5" colspan="2">
</td>
</tr>
<tr id="rptSplIns_trDetailRow_0">
<td height="28" align="left" valign="middle" bgcolor="#dee0df" class="insidedetails1">
01/13/2012
</td>
<td id="rptSplIns_tDCommentsBox_0" align="left" valign="middle" bgcolor="#dee0df"
...
CSS
.iframeSize { width: 400px; height: 295px; }
JavaScript
$("#pnlSpecialInstructions").fadeTo("slow", 1);
$("#iFrameSplIns").fadeTo("slow", 0.5);