|
|
|
|
![]() ![]() |
Apr 22 2005, 09:28 PM
Post
#1
|
|
|
Member [ Level 1 ] Group: Members Posts: 32 Joined: 22-December 04 Member No.: 1,849 |
Here's my problem:
I have a simple rollover menu, where the links light up whenever your mouse is over one of them. It works fine. In the simplest sense, I used this CSS code: (in .css file) a:link, a:visited {color:#000000} a:hover {color:#FF0000} This works! Yay! Okay. But when I click on any of the links (it is therefore considered "visited"), the hover function doesn't work anymore. The link becomes static (hover does not work anymore). And yes, I want my unvisited and visited links to be the same color. Question: How do I get the hover function to work on VISITED links, as it apparently does not? Is there some kind of property value I can put on either the a:hover tag, or the a:visited tag? Please help me!! |
|
|
|
Apr 22 2005, 10:32 PM
Post
#2
|
|
|
Advanced Member Group: Members Posts: 160 Joined: 1-January 05 From: USVI Member No.: 1,961 |
You forgot the visited link code.
Here you go: a:link { color: blue; } a:visited { color: blue; } a:hover { color: red; } |
|
|
|
Apr 23 2005, 06:39 AM
Post
#3
|
|
|
Member - Active Contributor Group: Members Posts: 92 Joined: 15-December 04 From: New Mexico Member No.: 1,759 |
QUOTE(everydaysushi @ Apr 22 2005, 02:28 PM) Question: How do I get the hover function to work on VISITED links, as it apparently does not? Is there some kind of property value I can put on either the a:hover tag, or the a:visited tag? Please help me!! If you expand your use of css you can control alot more concerning your links. Below is an example: CODE a:link {color: #006600; font-size: 9pt; font-family: Arial; font-weight: normal; text-decoration: none; background-color: transparent; cursor: hand; color: #FFFFFF; font-size:} a:visited {color: #006600; font-size: 9pt; font-family: Arial; font-weight: normal; text-decoration: none; background-color: transparent; cursor: hand; color: #FFFFFF; } a:hover {color: #6699FF; font-size: 9pt; font-family: Arial; font-weight: normal; text-decoration: none; background-color: transparent; cursor: hand; color: #6699FF; } a:active {color: #FF0000; font-size: 9pt; font-family: Arial; font-weight: normal; text-decoration: none; background-color: transparent; cursor: hand; color: #FF0000; } To add a second set of link controls simply add a class to the style. Example of link code using the class "dklink2": You can have as many link controls as you want, just create different classes. CODE a.dklink2:link {color: #006600; font-size: 8pt; font-family: Arial; font-weight: normal; text-decoration: none; background-color: transparent; cursor: hand; color: #006600; } a.dklink2:visited {color: #006600; font-size: 8pt; font-family: Arial; font-weight: normal; text-decoration: none; background-color: transparent; cursor: hand; color: #006600; } a.dklink2:hover {color: #ffffff; font-size: 8pt; font-family: Arial; font-weight: normal; text-decoration: none; background-color: transparent; cursor: hand; color: #ffffff; } a.dklink2:active {color: #ff0000; font-size: 8pt; font-family: Arial; font-weight: normal; text-decoration: none; background-color: transparent; cursor: hand; color: #ff0000; } You call the class by use of the "class" property in the anchor tagas follows: <a href="http://whatever.com" class="dklink2" target="_blank">Whatever</a> hope this helps pete |
|
|
|
![]() ![]() |
Similar Topics
|
Lo-Fi Version | Time is now: 5th December 2008 - 12:25 PM |