Archived

This topic is now archived and is closed to further replies.

  • 0

Classic Menu Dropdowns conflicted with superfade


Question

Posted · Report post

Classic nav is conflicting with superfade. dropdowns do not work.

 

Please advise.

 

http://bit.ly/1573zHg

 

 

Share this post


Link to post
Share on other sites

12 answers to this question

Posted · Report post

I think i used .section-branding 

Share this post


Link to post
Share on other sites

Posted · Report post

switched css to

.section-branding {height:185px; max-width:1024px;}

and works too.

 

Thanx

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

 

Sounds like Superfade is creating a z-index conflict with the menu.  I don't think it's anything more complex that that.

 

Are you able to find the z-index for both using Firebug or Chrome's Inspection Tool?

Share this post


Link to post
Share on other sites

Posted · Report post

yeah just playing around... and I cannot locate the z-index using firebug

 

looking at firefox... did you install a particular plugin to firebug to see z index?

Share this post


Link to post
Share on other sites

Posted · Report post

When I installed the superfade plugin the menu's appeared up as your screen image. Had to add the css to get the nav and content area below it.

#header {height:185px; max-width:1024px;margin-top:20px;}
.section-branding .mainlogo-link, .section-branding .mainlogo-img {
    display: block;
    margin-left: -20px;
    max-width: 100%;
}
.mainlogo-link {max-width:350px;}

Share this post


Link to post
Share on other sites

Posted · Report post

So apparently I need to add css in order to get the navigation menu below the superfade .

 

am I missing something here?

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

 

It would appear that the superfade plugin has a z-index conflict as I first thought.  If you look now at the drop down, the top level and first of the child level menu items work fine. As soon as they meet the same level of height as the superfade, the menu shuts and the second and third child items are unclickable.

 

I think the solution is to reposition the superfade to a different location no where near the menu.  Then you won't need CSS and won't have any problem.

Share this post


Link to post
Share on other sites

Posted · Report post

I'm not meaning to be persnickety... as you have a supported plugin that goes with the framework theme.

 

If I want a header image to have multiple sliders... you have a plugin to do that. I may add that it is a much used feature with other themes. And a good feature.

 

Not an option to "just move it elsewhere" as I want a rotating header image.. hence implementing the superfade, and not having to add an animated gif there.

 

Superfade implemented, kicks  BOTH  classic navigation and nav bar z-index behind the content.

 

Can we resolve this?

 

Not being disrespectful Rob, perhaps another staff member has a solution instead of "just not using it."

 

I left both navigations on the page.

Share this post


Link to post
Share on other sites

Posted · Report post

I think you added the superfade effect to the entire #header. The nav is in the #header so your having to add css to move it.

 

If you had applied the css fade to the branding section instead you would not need any css. http://screencast.com/t/1sXdNSvT

Share this post


Link to post
Share on other sites

Posted · Report post

Thank you Simon... I will try that and get back. ^_^

Share this post


Link to post
Share on other sites

Posted · Report post

Simon that resolved it. Inside the Superfade settings I swapped out #header to #branding

CSS to set static height and max-width of the slides to keep it responsive without cutting off the bottom of the images.

 

#branding {height:185px; max-width:1024px;}

:D

Share this post


Link to post
Share on other sites