Supersized jQuery plugin: preloader .gif image isn't visible in Internet Explorer 7

Had anyone experienced that issue before? What would be a good solution?

I'm using Supersized jQuery plugin to load full-screen background image. Supersized uses a .gif image as a basic preload开发者_如何学编程er. That image is displayed perfectly well in all the browsers except IE, where it's invisible.

How do I get this fixed?

UPDATE

This is what CSS looks like for that div:

#supersized-loader {
    position:absolute;
    top:50%;
    left:50%;
    z-index:10;
    width:60px;
    height:60px;
    margin:-30px 0 0 -30px;
    text-indent:-999em;
    background-color:#111;
    background:rgba(0, 0, 0, 0.8) url(../images/progress.gif) no-repeat center center;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
}

For some reason it renders the background color on top of the image. When I remove these: background-color:#111; background:rgba(0,0,0,0.8) I can see the image. How can I modify it to make it work in IE?

Would appreciate your advice!

This answer is the result of my discussion with PENDO (see comments). Apparently, IE7 renders the animated .gif image below the background color in the same div. Also jQuery doesn't seem to allow to prepend nested divs, and as a result I couldn't place the loader gif image inside the background div in supersized plugin. The workable solution was to remove the background completely in CSS and replace the relatively ugly default .gif of supersized plugin with a nicer-looking one that doesn't need any background.