...

View Full Version : Stop links from changing anything pass the first links



gopro01
06-07-2012, 10:01 PM
I'm new at this. I have a site that has a bar like googles. When i mouse over it changes from grey to white. But I don't want it to continue pass the header bar. Like google when you go to the bar on the side it stays black when you rollover. I don't know how to do this. I got onto w3schools site and they gave me their code but it dosn't work..

Google Example
http://www.google.com/search?client=safari&rls=en&q=google&ie=UTF-8&oe=UTF-8

W3scools example
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
a.ex1:hover,a.ex1:active {color:a4a4a4;}
a.ex1:hover,a.ex1:color {background:a4a4a4;}
a.ex1:visited,a.ex1:hover {text-decoration:none;}
a.ex1:hover,a.ex1:visited {text-decoration:none;}



a.ex2:hover,a.ex2:active {color:000000;}
a.ex2:hover,a.ex2:color {background:000000;}
a.ex2:visited,a.ex2:hover {text-decoration:none;}
a.ex2:hover,a.ex2:visited {text-decoration:none;}


</style>
</head>

<body>


<p><a class="ex1" href="default.asp">This link 1</a></p>
<p><a class="ex2" href="default.asp">This link 2</a></p>

</body>

</html>



I don't get it. When I roll over it it all still turns purple and with the line below it..

sunfighter
06-08-2012, 03:10 PM
a.ex1:hover,a.ex1:active {color:a4a4a4;}
a.ex1:hover,a.ex1:color {background:a4a4a4;}
a.ex1:visited,a.ex1:hover {text-decoration:none;}
a.ex1:hover,a.ex1:visited {text-decoration:none;}

You are declaring your hover four times! Why?
If you make the color and the background the same you just get a block with no writing.
Next: the hex color number should be prefaced by the # sign
And last: There is an order for the pseudo-classes. See http://www.w3schools.com/css/css_pseudo_classes.asp

Use this as a start and get it the way you want it:


<style type="text/css">
a.ex1:visited {text-decoration:none;}
a.ex1:hover {background:#a4a4a4;text-decoration:none;}
a.ex1:active {color:#a4a4a4;}

a.ex2:visited {text-decoration:none;}
a.ex2:hover {color:#000000;}
a.ex2:active {color:#000000;}
</style>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum