Home/ Questions/Q 4611402
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-22T01:15:48+00:00

Had anyone experienced that issue before? What would be a good solution? I’m using

  • 0

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 preloader. 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!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    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.

    • 0