Images coming in front and dropdown menu remains behind.

Asked By wyman zeb 10 points N/A Posted on - 02/01/2013

Hello,

I adhere accompanied a slideshow on my website. The instant I am trying to dropdown using the dropdown menu.

But the dropdown menu remains behinds the images.

It is little urgency to me.

Please solution me to solving this problem.

Thanks all

• Status: Open
• Question Views: 678
• Answer Count: 1
• Vote Up 0 Vote Down

• Answer Accepted: No
• Question Category: Anonymous questions

Answered By Drake Vivian 30 points N/A #148776

Images coming in front and dropdown menu remains behind.

Hello,

 

This is a common and very annoying problem, with a gorgeously simple solution. Menu falls behind the slideshow because of the wrong z-index.

 

I don't know how your code looks like, so I will just give you general guidelines how to fix this.

 

If you are using divs on your page, make sure that  the menu's parent div has the higher z-index than a div containing the slideshow. 

 

Simplified, your HTML code will look like something like this:

 

<div style="z-index: 2;">

*menu code*

    <div style="z-index: 1;">

*slideshow code*

    </div>

</div>

 

If you are using css for styling your page, find the menu and slideshow classes and add them z-index, like this:

 

.menuclassname, ul.menuclassname, li.menuclassname, … { 

background:#000; 

color: #ccc; 

display:inline-block; 

z-index:1000; 

}

.slideshow {

z-index: -1000; 

}

About Drake Vivian

Questions
0

Answers
820

Best Answers
186

• Vote Up 0 Vote Down

• Posted on - 02/07/2013
• Question Category: Anonymous questions