 Navigation Bar Buttons |
  |
| dsmith916 |
 Feb 12 2013, 02:43 AM
Post
#1
|
|
Advanced Member  Group: Members Posts: 162 Joined: 5-December 12 Member No.: 18,203  |
I want to create a navigation bar with the names of the menus in helvetica white on a black rectangle all side by side separated by 1px
When you mouse over the menu I want a color to appear under the text the same width as the black rectangle behind it. Green for example So there are seven links in a line horizontally, white text over black rectangles. When the mouse is over one of the menus a green line similar to a rectangle appears at the bottom of the black rectangle (lets say about 4px tall) Here is the page I am working with: http://duncansphotos.com/grey.html |
  |
 
|
| Darin McGrew |
Feb 12 2013, 04:34 AM
Post
#2
|
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
You can use the :hover pseudo-class in your CSS to give the mouseover effect.
http://www.w3.org/TR/CSS2/selector.html#dy...-pseudo-classes |
|
|
|
| Frederiek |
Feb 12 2013, 04:57 AM
Post
#3
|
|
Programming Fanatic Group: Members Posts: 5,146 Joined: 23-August 06 From: Europe Member No.: 9 |
See also the Horizontal Lists at http://css.maxdesign.com.au/listamatic/ . The "Simple Bits tabbed navbar" has part of what you want.
|
|
|
|
| dsmith916 |
Feb 13 2013, 01:02 AM
Post
#4
|
|
Advanced Member Group: Members Posts: 162 Joined: 5-December 12 Member No.: 18,203 |
QUOTE(Frederiek @ Feb 12 2013, 04:57 AM)  See also the Horizontal Lists at http://css.maxdesign.com.au/listamatic/ . The "Simple Bits tabbed navbar" has part of what you want. Thanks! |
|
|
|
|
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:
|
Lo-Fi Version | Time is now: 19th April 2024 - 11:42 AM |
Invision Power Board
© 2024 IPS, Inc.
Licensed to: HTMLHelp.com, LLC