Home/ Questions/Q 6935061
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T12:03:10+00:00

I’m looking for alternatives to Supersized. I’m currently using version 3.0 to show some

  • 0

I’m looking for alternatives to Supersized. I’m currently using version 3.0 to show some rotating background images and found two problems on Internet Explorer.

  1. The transicion is far from smooth, and is very slow. On Chrome and Firefox this works ok.
  2. Some times, the background images are vertically enlarged and deformed.

Does anyone knows an alternative, or a tweak to fix those problems?.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Use any slider and float it behind the content of the page using z-index. I like Nivo Slider when I’m just sliding images, and bxSlider when I need to slide a div or ul with arbitrary content.

    The element you’re applying z-index to must be position: relative; or position: absolute. One thing to note about position: absolute; is that it will position the element with respect to the first parent element that is position: relative; or position: absolute. That may sound confusing, so how about an example:

    Put your slider inside <body> and wrap it in a div:

    <body>
    <div class="container">
        <!-- Your slider divs/imgs/ul -->
    </div>
    <div class="rest-of-page">
        ...
    </div>
</body>

    Then some css:

    /* Position .container relative to body (not really needed, just an example) */
body { position: relative; }

/* Float slider behind content of page, expanding to width/height of document
 * and use z-index of -1 to place it behind actual page content. */
.container { 
    position: absolute; 
    top: 0%; 
    left: 50%; 
    width: 100%; 
    height: 100%; 
    z-index: -1; 
}

/* Float the actual page content above slider using z-index of 0 */
.rest-of-page { position: relative; z-index: 0; }

    And that should do it. Normally you have to define a width for your slider images, but with some fiddling I think you can get it working. In my own projects I’ve been centering the slider to the page, not taking up the entire background, so your mileage may vary.

    • 0