How to display non fixed elements above fixed elements

By : Goose

I have a page with both fixed and non fixed elements. I am using a div to make the background blue, and then fading it out to reveal the black background behind it in the html css. The problem is, my skyline image is not fixed, and nothing can push it above the fixed elements, not even z-indexing. What's the appropriate way to push this element above the fixed background div.

The problem in short, is I want my blue sky behind my cities.

Here's the css for the blue background div

.blue {
height: 100%;
width: 100%;
background-color: #6e8eb5;

Here's how I'm fading it out.

$( ".blue" ).delay( 12000 ).fadeOut(2000);

Here's my jsfiddle.

By : Goose



I've also fixed position of elements, etc. as I suppose you intended to position them


By : ctwheels

This video can help you solving your question :)
By: admin