To make your navigation bar light up when your mouse scrolls over it, and have it shadowed over when it's not, then i'd recommend this code for you

I HAVE ONLY TESTED THIS ON FORUMOTION PHPBB3 forums!
Here is the complete code:

Code:

/* Menu-------------------------------------------------*/
.navbar {
}
ul.linklist li a img {
filter:alpha(opacity=20);
-moz-opacity: 0.5;
opacity: 0.3;
}
ul.linklist li a img:hover {
filter:alpha(opacity=100);
-moz-opacity: 2.0;
opacity: 1.9;
position: relative;
cursor:allowed;
}

#page-header #search-box {
display: none;
}

You insert that code in the CSS, anywhere in the CSS, and it will make your navigation buttons like this:
EXAMPLE

You can edit the opacity, padding, and such by editing the numbers in the code, :

/* Menu-------------------------------------------------*/
.navbar {
padding:0px 10px;
}
ul.linklist li a img {
filter:alpha(opacity=20);
-moz-opacity: 0.5;
opacity: 0.3;
}
ul.linklist li a img:hover {
filter:alpha(opacity=100);
-moz-opacity: 2.0;
opacity: 1.9;
position: relative;
cursor:allowed;
}

#page-header #search-box {
display: none;
}

I've bolded the main things in the code to what you can edit; not to say that cannot edit other parts of the code, but if you're new, i'd recommend not really editing anything or just the bolded numbers.

hi i tried this! It works! Nice tutorial! Great job!

Nice tutorial Amber.
Can you tell why is this part there in the code...

Code:

.navbar {
clear: both;
background-image: url("http://content.doxcentral.com/Nordevall/img/wbg.gif");
padding:0px 10px;
}

and this...

Code:

#page-header #search-box {
display: none;
}

I don't think it has anything to do with the opacity. Please remove it from there.

Please make sure if this code works for all version. It would be much better if you provide this tutorial for all version

Nice tutorial Amber.
Can you tell why is this part there in the code...

CODE:
.navbar {
clear: both;
background-image: url("http://content.doxcentral.com/Nordevall/img/wbg.gif");
padding:0px 10px;
}

I'm not actually sure, I always added it, but it works fine without it.

I don't think it has anything to do with the opacity. Please remove it from there.

Please make sure if this code works for all version. It would be much better if you provide this tutorial for all version

Actually, it comes out different without it, there is more of a space under the navigation bar see:

Without the code
With the code



______________________________
The code Only works on Phpbb3, I've tested it on the other forum versions, and it Only works on phpbb3.

Amber, your contribution is appreciated

This tutorial is useful only for those who use phpBB3 version on Forumotion.
Since it is for very limited amount people, won't be much beneficial, so it will be rejected.

Tutorial Rejected
Locked-zoids25