Best Answer Danny , 03 December 2012 - 10:55 AM
Alright Dave!
Add this to your custom CSS:
.purple.sfHover { background:#BA8ABD;}
.pink.sfHover { background:#F04991;}
.green.sfHover { background:#A0C758;}
Go to the full post 
Super Member
Posted 28 November 2012 - 03:55 PM
Any idea what the CSS might be to set the background color of the parent link when you are hovered over one of the secondary links in the navigation?
I got most of the customization completed -- all I need now is for the parent link option to stay highlighted when I roll over onto one of the secondary links.
Here is the live site so you can see what I am talking about:
Advocate
Posted 28 November 2012 - 04:53 PM
"all I need now is for the parent link option to stay highlighted when I roll over onto one of the secondary links."
To clarify, are you looking for a way to get the parent link background to stay a certain color while the visitor is currently viewing a subpage?
Super Member
Posted 30 November 2012 - 02:02 AM
No, I want the background of the parent link to stay highlighted when I roll over onto one of the dropdown options.
So for example, if you go to
, and roll over the 'How it Works' link in the navigation menu, you will notice that the background becomes purple and drop down options appear. When I roll over one of the dropdown options, I want the parent link (in this case 'How it Works' to remain with a purple background.
Any idea how to do this? I have been fooling around with the CSS for a few days now with no success.
Advocate
Posted 30 November 2012 - 05:17 AM
Hi there, haven't had a chance to play around with this but the below code accesses the color for the parent item on a submenu. You'll need to set :hover attribute somewhere to get the effect you're looking for, have a play with it see what you come up with. 
Super Member
Posted 02 December 2012 - 07:07 PM
Thanks James... As frustrating as the nav is in pagelines, I usually can tinker away until I get the CSS to do what I want it to do. I'm surprised because I've hit a wall. Let me try to be more clear for a more helpful response:
Basically, each parent link in the primary nav has it's own custom style (i.e. .purple for purple background or .green for green background). Most of the parent links in the primary nav have a drop down menu.
I want the background color of the primary link to remain highlighted (i.e. purple) when I rollover on of the dropdown options. Instead, it goes to white when I roll over one of the dropdown options.
Hopefully this is a little more clear. Any help would be greatly appreciated! Thanks!
One Smart Egg
Posted 02 December 2012 - 10:42 PM
Dave, I think you need the active state. You've got the hover down pat.
To clarify... When a cursor is placed over something, it is in hover state, resulting in the change of the element's color, as desired. But, if clicked, you want that color to remain in place. That is an active state, effectively meaning you are actively in that element.
The way to achieve this is best described in this:
I think you need a copy of James' code but need to add
Super Member
Posted 02 December 2012 - 10:48 PM
I thought the active state only is only effected when you are on that particular page (hence, being an active page). I am not looking for it to change when it is an active page, I am looking for it to remain the hover color when I roll off of the primary link and onto one of the dropdown options.
Does that make sense?
One Smart Egg
Posted 02 December 2012 - 11:25 PM
Right. I'm at a loss then.
Super Member
Posted 02 December 2012 - 11:27 PM
Yeah, here is a video link to better illustrate what I am talking about... (SORRY FOR ALL THE BACK AND FORTH CONFUSION!):
Super Member
Posted 02 December 2012 - 11:57 PM
Here are all the custom styles I have created in CSS to accomplish what I have so far... maybe there is an error with my code that is conflicting??? (don't think so, but you never know).
Ninja
Posted 03 December 2012 - 10:55 AM Best Answer
Alright Dave!
Add this to your custom CSS:
Super Member
Posted 03 December 2012 - 04:07 PM
DANNY! YOU ARE AMAZING! IT WORKS! THANKS SO MUCH!
