Question

I’m using a JQuery script to load, hide and show content on a page, with a gif file that’s visible to the user while the content loads on the page. This works in Safari and Firefox but not on IE. The user can see the content loading.

Thanks for any suggestion on how to resolve this.

The JQuery:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
      $("#content-loading").show();
$("#block_a").hide();
  $(window).load(function() {
    $("#block_a").show();
    $("#content-loading").hide();
  })
})
</script>

The div containing the gif:

<div id="content-loading">

Answer 1

It might be that you’re using $(document).ready to show the content-loading gif and hide the block_a. Try putting this in a CSS stylesheet at the top of your page:

#block_a { display:none; }

That will hide the block immediately.