Nivo Slider Always On Top Issue

Permalink Browser Info Environment
I have a horizontal navigation above the Nivo slider. When I mouseover the drop-down nav, it is always behind the Nivo Slider. I have tried adjusting the Z-axis on both the nav and Nivo css but no luck.

It can be witnessed here:
http://www.envyallstar.com/index.php...

If you've got any ideas, please pitch them my way. This is my 2nd purchase of this slider because I love it . .thanks.

Type: Discussion
Status: New
chai714
View Replies:
kewlgrrl replied on at Permalink Reply
It looks like you found out how to fix this according to your link. I am having the same problem. How did you fix?
Redtale replied on at Permalink Reply
Hopefully I can help you with this (I also worked on this site). It's been awhile since I fixed this problem but I believe I fixed it by changing some things in my Superfish nav's view.php. I don't have the original files so I don't have anything to compare to. If you're using Superfish let me know and and I'll try to troubleshoot.
kewlgrrl replied on at Permalink Reply
Thanks I am using Superfish. I've been reading that it might have something to do with the z-index. Does that sound familiar to you? My drop-down will show up over the first slide but the second slide it goes behind it - almost like it is fighting with it to be on top.
Redtale replied on at Permalink Reply
I did change some z-indexes in the nivo-slider.css but I don't think it solved the problem (I was trying just about everything I could think of).

Here is what I changed in the nivo-slider.css:

Added z-index to the following:
.nivoSlider a.nivo-imageLink {} mine is set to 60
.nivo-slice {} mine is set to 50

Changed z-index from the following:
.nivo-directionNav a {} changed from 0 to 99

Removed z-index from the following:
.nivoSlider {}
.nivoSlider img {}

I also added z-index to my nav div. It's set at 100.

Hopefully that solves your problem. I still think that the issue was solved in Superfish though.
ramad3d replied on at Permalink Reply
ramad3d
hi i changed

/* The Nivo Slider styles */
.nivoSlider {
position:relative;
z-index:-99;
}

now its working :)
sebastienj replied on at Permalink Reply
sebastienj
Hi,

it's seems to be ok now?
chai714 replied on at Permalink Reply
chai714
Hi Kewlgrrl and Sebastienj,

The issue seems to be the combination of using Superfish Menu and Nivo. But the actual problem I believe lies within Superfish, not Nivo slider.

Redtale and I work together on websites and he was the one who actually resolved this problem. We were examining the CSS in the Nivo slider, thinking it had to do with the z-index however I think Redtale discovered the problem was actually within the Superfish menu. Anyone else reading this post (which I have had a couple private messages) should examine the Superfish code and probably not the Nivo slider.

We have built a few websites incorporating the Nivo slider and the only time we had this particular issue was when we were using the Superfish menu. Hope this helps. Also, feel free to pm me or post a link to your website and I'll try to help.
tedallen replied on at Permalink Reply
Hello everyone,

I happened across this post and am having a very similar, if not exact, issue with my website. (http://www.ibany.org/jupgrade) I am upgrading my Joomla 1.5 site to a 2.5 site and thus had to upgrade some components to the Superfish Menu and the slider to Vinaora Nivo Slider. I have the menu working but the Nivo Slider won't display the pictures currently. I have tried the z-index etc and no luck! Also I have changed the superfish menu to css instead of jQuery but none of the animations work and the submenu items sit behind the nivo slider. Any help you can provide would be much appreciated!

Thanks!

concrete5 Environment Information

Browser User-Agent String

Hide Post Content

This will replace the post content with the message: "Content has been removed by an Administrator"

Hide Content

Request Refund

You have not specified a license for this support ticket. You must have a valid license assigned to a support ticket to request a refund.