BlockUI doesn't work in IE - Please help..

BlockUI doesn't work in IE - Please help..

Hi,
I'm using the BlockUI plugin to prevent user action on a page when a hyperlink/button is clicked on a page. The page is created using frame. It works on Firefox (only on the targeted frame, center), but not IE or Chrome.  In IE the shade/gray block shows up at the bottom of the page, after all the page content. Also the default "Please wait.." message displays after the gray box.

Here's my code, tried with both a hyperlink and button. same result, doesn't work:
<tr>
      <td >
            <s:a href="%{urlTag}" onclick="blockPage()" id="test1">View ECF</s:a>
            <INPUT type="button" id="blocktest" name="block" value="block"/>
      </td>
</tr>


Javascript file for hyperlink:

function blockPage() {
    //alert("hello....");
   
     $(document).ready(function () {
            $.blockUI({ message: '<img src="../../img/ajax-loader-ball.gif"> Please wait...' });
        });

}

Inline Javascript for button:
<script type="text/javascript">
       $(document).ready(function() {
        $('#blocktest').click(function() {
            $.blockUI();
           
            <Query database and forward to new page>
        });
       
    });
</script>


Thanks in advance for you help. Any help would be greatly appreciated.

Jeff