How to remove the hover over link boxes in nukeNAV?

New Member Joined: Jul 21, 2012 Posts: 3

Title says it all. I've searched high and low editing everything I can to try.

Thanks!

Posted: Fri Aug 17, 2012 6:53 am

Are you trying to edit the nukeNAV block, or the main nukeNAV menu?

The default styles are loaded via includes/jquery/css/nukeNAV.css and then overridden by theme themes/YOUR_THEME/style/nukeNAV.css

Not all of the styles are re-declared by theme so it's possible you need to add some more declarations to your themes/YOUR_THEME/style/nukeNAV.css to edit the hover style. If you are editing the main menu you are probably looking for this line, if it is not present in your themes/YOUR_THEME/style/nukeNAV.css I would add it; adding whatever styling you need.

.nukeNAV li:hover,.nukeNAV li.sfHover,.nukeNAV a:focus,.nukeNAV a:hover,.nukeNAV a:active{}

If you are using the block you are probably looking for this line. Once again, if it is not present in your themes/YOUR_THEME/style/nukeNAV.css, add it (do not edit includes/jquery/css/nukeNAV.css)

.nukeNAVmod li:hover,.nukeNAVmod li.sfHover,.nukeNAVmod a:focus,.nukeNAVmod a:hover,.nukeNAVmod a:active{}

Hopefully that will get you going in the right direction. Tools such as Firebug for Firefox are great for these type of issues, as you can right click any element and inspect to find all associated styling (and where it is declared)
https://getfirebug.com/

Posted: Fri Aug 17, 2012 2:21 pm

Ok, was messing around with it in firebug, trying to find out which one takes care of the dropdown menus. I was assuming it was the superfish hovers. I've tried editing the nukeNAV.css a hundred different ways. Went in and even deleted the superfish files. But the dropdowns keep coming.

Any more tips? Smile

Thanks.

registered · Posted: Fri Aug 17, 2012 2:31 pm

What are you wanting to accomplish? Do you want static links instead of the dynamic links? If so, you cam deactivate nukeNAV in the rnconfig file.

Posted: Fri Aug 17, 2012 3:35 pm

I'm a little unclear what you are having issues with, but working on the assumption you are talking about the main nukeNAV menu (not the block) and having trouble styling the dropdown and sub-menus. The dropdown menus are css based (at least mostly) so removing JS files will not keep them from appearing... However the submenus do require JS

Where you just trying to remove them because you couldn't style them?

Posted: Fri Aug 17, 2012 7:23 pm

Hmm... I guess the dropdown menus would be useful if I could style them a bit better, so I guess that's the primary reason. I deff don't want the submenus. What would be useful though is to have any menu that comes down, come down as one bar with the links arranged centered horizontally, and the arrows taken out. But I have no idea how to go about that. I can follow most of the css and php code, but the nukeNAV stuff is confusing to me. I'm not sure where or how it does half the stuff it does. I looked at a few themes that had the nukeNAV centered to see how it was done, but I honestly couldn't tell one bit of a difference, one between the other.

Site Admin Joined: Aug 22, 2007 Posts: 1775

The markup is not hard to understand, look at this:

Code:

$nukeNAV  = '<ul id="nukeNAV" class="nukeNAV">'; // start nav


$nukeNAV .= '   <li><a href="#">A</a>'; // start 1st top button


$nukeNAV .= '      <ul>'; // start drop down


$nukeNAV .= '         <li><a href="#">A1</a></li>'; // 1st drop down


$nukeNAV .= '         <li><a href="#">A2</a></li>'; // 2nd drop down


$nukeNAV .= '         <li><a href="#">A3</a>'; // 3rd drop down with sbumenue


$nukeNAV .= '            <ul>'; // start sbumenue


$nukeNAV .= '               <li><a href="#">A3 - 1</a></li>'; // 1st sbumenue


$nukeNAV .= '               <li><a href="#">A3 - 2</a></li>'; // 2nd sbumenue


$nukeNAV .= '               <li><a href="#">A3 - 3</a></li>'; // 3rd sbumenue


$nukeNAV .= '            </ul>'; // end sbumenue


$nukeNAV .= '         </li>';// end 3rd drop down with sbumenue


$nukeNAV .= '      <ul>'; // end drop down


$nukeNAV .= '   </li>'; // end 1st top button


$nukeNAV .= '</ul>'; // end nav

To center the nukeNav is quickly to realize with display:inline-block. For Example i use the RavenIce theme. Open the NukeNav.css in the RavenIce style folder (themes/RavenIce/style/) and open the NukeNav.css in the jquery foler (includes/jquery/css/)

find in themes/RavenIce/style/NukeNav.css:

Code:

.nukeNAV{width:auto;line-height:24px;float:left;padding-bottom:0px;margin-bottom:0px;font-weight:400;font-size:10px;}

change it to:

Code:

.nukeNAV{width:auto;line-height:24px;display:inline-block;padding-bottom:0px;margin-bottom:0px;font-weight:400;font-size:10px;}

find in includes/jquery/css/NukeNav.css:

Code:

.nukeNAV{width:auto;line-height:1.0;float:left;margin-bottom:1em;font-weight:400;font-size:12px;}

change it to:

Code:

.nukeNAV{width:auto;line-height:1.0;display:inline-block;margin-bottom:1em;font-weight:400;font-size:12px;}

find in includes/jquery/css/NukeNav.css:

Code:

.nukeNAV li{width:auto;float:left;position:relative;background:#BDD2FF;}

change it to:

Code:

.nukeNAV li{width:auto;float:left;position:relative;background:#BDD2FF;text-align:left;}

Now open the nukeNav.php and find the start:

Code:

$nukeNAV = '<ul id="nukeNAV" class="nukeNAV"><li><a href="./">'._HOME.'</a></li>'."\n";

change it to:

Code:

$nukeNAV = '<div class="text-center"><ul id="nukeNAV" class="nukeNAV"><li><a href="./">'._HOME.'</a></li>'."\n";

Now find the end:

Code:

$nukeNAV .= '</ul>';

change it to:

Code:

$nukeNAV .= '</ul></div>';

Save all files and you have centered nukeNav Smile

In some themes you have an second part for the login. Here you must change the width in css to the correct size. Its different from theme to theme.

Smile