Jump to content


Photo
- - - - -

Submenu/Navigation


  • Please log in to reply
8 replies to this topic

#1 purple

purple

    Advanced Member

  • Members
  • 38 posts

Posted 03 May 2012 - 03:00 PM

I have made the nav bar on my site have hover images. However, the problem is that when I implement a submenu it carries the hover images down into the submenu. See an example here:

Please Login or Register to see this Hidden Content



I would like the submenu to be transparent and have no images. Any ideas? This is the code I am using to create the hover:

Please Login or Register to see this Hidden Content


My site is currently on a development server on my desktop. I can try to upload it to a domain if you need to see something more than screen captures.

Thx.

#2 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts
  • LocationWV
  • Country: Country Flag

Posted 03 May 2012 - 04:09 PM

Something like adding a transparent background to the subnav element may work. Have you tried that?

#3 purple

purple

    Advanced Member

  • Members
  • 38 posts

Posted 03 May 2012 - 05:21 PM

That worked. Thanks!

Now, how would I specify that I want the subnav hover font color to stay the same and not change to white like the main nav? Here is the code I have tried:

Please Login or Register to see this Hidden Content

Please Login or Register to see this Hidden Content


I have also tried to do it by specifying each individual menu item #.

Any ideas?

#4 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts
  • LocationWV
  • Country: Country Flag

Posted 03 May 2012 - 06:19 PM

Awesome! :) It's hard to determine exactly what you need to use since your site isn't live, but you could try to add the 'a' element in there (if you want them to use the same color):

Please Login or Register to see this Hidden Content



#5 purple

purple

    Advanced Member

  • Members
  • 38 posts

Posted 24 July 2012 - 10:56 PM

Okay, I finally have had time to sit down and try the above. Unfortunately it didn't work. I have uploaded my website to a sample domain at:

Please Login or Register to see this Hidden Content

.

The issue I am still having is that when I hover over the subnav area the link color is white. This was necessary in the main menu due to the green hover effect. But on the subnav it makes it so I can't see the text. Also, I would like to get rid of the gray box if possible. Another option I would be okay with if I can't do the other is changing the hover background of the subnav to be the same color of green as the hover effect.

Here is my current code:

Please Login or Register to see this Hidden Content



#6 Danny

Danny

    Is Awesome!

  • Moderators
  • 17015 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 25 July 2012 - 11:17 AM

Hi,

Add this to your custom CSS and see if this does the trick.

Please Login or Register to see this Hidden Content



#7 purple

purple

    Advanced Member

  • Members
  • 38 posts

Posted 26 July 2012 - 03:03 AM

@Danny thanks for the response. Unfortunately that turned all of the links to purple, including the main nav and the dropdown item links on hover. So that still doesn't help me target just the dropdown item links on hover.

#8 purple

purple

    Advanced Member

  • Members
  • 38 posts

Posted 26 July 2012 - 03:15 AM

I decided to just go ahead and upload a green background image for the hover as a work around. But if anyone knows how I can still target just the dropdown links on hover I would love to have the knowledge. :-)

#9 Danny

Danny

    Is Awesome!

  • Moderators
  • 17015 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 26 July 2012 - 11:45 AM

Hi,

I have just tested the code below and that is working for me.

Please Login or Register to see this Hidden Content