IE8 problem with Jquery positioning

I am trying to position a loading graphic in the middle of the view window using jquery. The solution I came up with works in all browsers except IE8 or older:

JS

   <script type="text/javascript">
      jQuery(document).ready(function(){
        jQuery("#loading_spinner").css("left", window.innerWidth/2);
        jQuery("#loading_spinner").css("top", window.开发者_如何学CinnerHeight/2);
      });
    </script>

HTML

       <div id='GB_overlay' style="display:none;">
        <div id="loading_spinner" style="position:absolute;">
          <img src="/img/transparent_loader.gif" alt="#"/>
        </div>

For some reason, in IE8 or lower, the spinner gets positioned in the top left corner of the screen not the center. Is this an IE bug? How can I fix this?

Innerwidth and innerheight are not supported in IE.(except IE9)

See quirksmode

You can use

$(window).height() and $(window).width()

Your problem is window.innerWidth and window.innerHeight which do not work on IE.

It's safest to use jQuery to work this out, use one of the following as required,

$(window).height();   // returns height of browser viewport
$(document).height(); // returns height of HTML document

Try using

http://api.jquery.com/height/