vb.org Archive - How to Change Nav Bar Tab Hover Color

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vB4 General Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=251)

- - How to Change Nav Bar Tab Hover Color (https://vborg.vbsupport.ru/showthread.php?t=255498)

AlexisMedia

12-18-2010 09:35 PM

How to Change Nav Bar Tab Hover Color

It appears the admin stylevar uses navbar_tab_selected_background as both the selected and the hover color. How can I get a different hover color then selected? I'm referring to the "forum" and "what's new" tabs...

Thanks!

TheLastSuperman

12-18-2010 10:01 PM

Quote:

Originally Posted by AlexisMedia (Post 2136104)

Edit the CSS Template: vbulletin-chrome.css

Find:

Code:

.navtabs li.selected a.navtab {

        color:{vb:stylevar navbar_tab_linkhover_color};

        background:{vb:stylevar navbar_tab_selected_background};

        _background-image:none;

        position:relative;

        top:-{vb:stylevar navbar_tab_selected_top_width}px;

        padding-top:{vb:stylevar navbar_tab_selected_top_width}px;

        z-index:10;

}

Replace {vb:stylevar navbar_tab_linkhover_color} with either a hex #FF0000 or a rgb(205, 205, 205) value OR use another stylevar you know has the correct color ;).

LifesGreatestGift

12-19-2010 05:11 PM

you will need to add some new css code

You can change the "selected" color in the stylevar. For hover color go to template additional.css

Add the following, feel free to customize the color

Code:

.navtabs li a.navtab:hover {

        color:#ffffff; /* Color of text for hover */

        background-color:#000000; /* Color for background of button when hovered */

}

Now if you'd like to use an image for the background button hover then use

background:url(hxxp://urltoimage.png) #000000 no-repeat;

as opposed to background-color

AlexisMedia

12-20-2010 09:53 PM

Quote:

Originally Posted by TheLastSuperman (Post 2136112)

Edit the CSS Template: vbulletin-chrome.css

Can I ask how you knew that would be located in that specific template? I never would have guessed that as it's not named anywhere close? I'd like to be able to hunt this stuff down on my own quickly if I can learn it : )

Thanks!

--------------- Added [DATE]1292889310[/DATE] at [TIME]1292889310[/TIME] ---------------

Quote:

Originally Posted by TheWindows7Site (Post 2136437)

go to template additional.css

I've already done it the other way but this way is a good idea to change it too so I have less edit logging to do then it sounds like...

Thanks!

LifesGreatestGift

12-20-2010 10:31 PM

He finds the css identifier with firebug then searches in templates to see where it is called. More than likely most styling is called in vbulletin-chrome.css

AlexisMedia

12-20-2010 11:13 PM

Ok, got ya... Thanks!

All times are GMT. The time now is 01:11 PM.

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01126 seconds Memory Usage 1,725KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (2)bbcode_code_printable (3)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)post_thanks_navbar_search (1)printthread (6)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: