Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 209
  • Last Modified:

z-index problem with web page how to solve this

I have a jquery menu that drops down over a static image working perfectly.  Then I had to convert the image to another jquery that is called cycle 2 where the image replaces itself with another image.  After adding that the menu displays behind it instead of infront of the picture.  The image is in a div tag named <div class="grid_12">.  I tried adding the zindex: 1; to this and that did not fix it.  Tried modifying div tags menu was in also same thing.  Can someone tell me how to fix this?
0
kdschool
Asked:
kdschool
  • 3
  • 2
1 Solution
 
GaryCommented:
Without a link impossible to answer
0
 
kdschoolAuthor Commented:
It is inside a firewall so you can see it.  What if attach the code?
0
 
GaryCommented:
Save the page as Webpage Complete and attach
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
Dave BaldwinFixer of ProblemsCommented:
"zindex: 1;" is essentially what 'normal' content is.  Most overlays are declared to be 99 or 999.  Also, 'zindex' only works on 'positioned' elements even if the 'position' is relative.  It does have to be declared for 'zindex' to work.
0
 
kdschoolAuthor Commented:
It is weird but  I had to create a new class that wraps around the rotating images and assigning that to the z-index 1;  It made the images go behind the menu again.  Weird as I was trying to put the z-index on the menu and that was not working.  So much for jquery.  Anyway just wanted to put this out there since it seems to be working opposite of what I thought it should be.  Thanks for your help.
 
CSS
.cycle-slideshow {z-index:1;}
source code
<div class="cycle-slideshow">
           <img src="/NewSiteFiles2/images/courier.jpg">
          <img src="/NewSiteFiles2/images/sax.jpg">
          <img src="/NewSiteFiles2/images/sax2.jpg">
      </div>
0
 
kdschoolAuthor Commented:
This solution helped me the most.  Complex problem without seeing the code.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now