jnf555 Posted March 20, 2009 Share Posted March 20, 2009 hiI AM TRYING TO CHANGE THE COLOR OF A BACKGROUND WHEN THE MOUSE HOVERS OVER IT, THEN BACK TO ORIGINAL COLOR WHEN MOVED OF, I ALSO WANT THE IREA TO HAVE A LINK TO ITANYONE HELPTHANKSJNF555 Link to comment Share on other sites More sharing options...
Shade Posted March 20, 2009 Share Posted March 20, 2009 CSS:.myclass {background-color : #aaaaaa;}.myclass:hover {background-color : #bbbbbb;} Link to comment Share on other sites More sharing options...
jnf555 Posted March 20, 2009 Author Share Posted March 20, 2009 THANKS I'L HAVE AGO Link to comment Share on other sites More sharing options...
jnf555 Posted March 20, 2009 Author Share Posted March 20, 2009 i think i am missing something out here anyone help, i want it to change background color when i hover over<html><head><style type="text/css">.a {background-color : yellow;}.a hover {background-color : blue;}.a {width:300px;height300px}</style></head><body><div class=a>hover over to change background color</div></body></html>thanksjnf555 Link to comment Share on other sites More sharing options...
Ingolme Posted March 20, 2009 Share Posted March 20, 2009 Make that .a:hover Link to comment Share on other sites More sharing options...
jnf555 Posted March 20, 2009 Author Share Posted March 20, 2009 <html><head><style type="text/css">.a {background-color : yellow;}.a:hover {background-color : blue;}.a {width:300px;height300px}</style></head><body><div class=a>hover over to change background color</div></body></html>sorry stiil not working Link to comment Share on other sites More sharing options...
jlhaslip Posted March 20, 2009 Share Posted March 20, 2009 <div class="a"> Link to comment Share on other sites More sharing options...
Guest FirefoxRocks Posted March 20, 2009 Share Posted March 20, 2009 <div class="a">Quotation marks are not necessary when the value of the attribute is alphanumeric characters with no spaces. However it does make your code look cleaner. Link to comment Share on other sites More sharing options...
jnf555 Posted March 20, 2009 Author Share Posted March 20, 2009 <html><head><style type="text/css">.a{background-color : yellow;}.a:"hover" {background-color : blue;}.a {width:300px;height300px}</style></head><body><div class="a">hover over to change background color</div></body></html>still not working any other advice welcome Link to comment Share on other sites More sharing options...
Synook Posted March 21, 2009 Share Posted March 21, 2009 Remove the quotation marks around "hover"... how did they get there in the first place?And don't use IE6? Link to comment Share on other sites More sharing options...
Renegade605 Posted March 22, 2009 Share Posted March 22, 2009 Quotation marks are not necessary when the value of the attribute is alphanumeric characters with no spaces. However it does make your code look cleaner. Attribute values must be quoted And to jnf555, that should be height:300px; don't forget the colon. Link to comment Share on other sites More sharing options...
Guest FirefoxRocks Posted March 22, 2009 Share Posted March 22, 2009 In certain cases, authors may specify the value of an attribute without any quotation marks. The attribute value may only contain letters (a-z and A-Z), digits (0-9), hyphens (ASCII decimal 45), periods (ASCII decimal 46), underscores (ASCII decimal 95), and colons (ASCII decimal 58). We recommend using quotation marks even when it is possible to eliminate them.They are only recommended but not necessary with characters A-Z, 0-9, - . : and _. Link to comment Share on other sites More sharing options...
Synook Posted March 22, 2009 Share Posted March 22, 2009 They are only recommended but not necessary with characters A-Z, 0-9, - . : and _.Yeah, just like closing tags are recommended, but not necessary when unambiguous... well, maybe not exactly like that but I would advocate to always use quotation marks for consistency and just in case.And talking about unnecessary, you don't actually need a semicolon on the last attribute in a CSS rule... but I would still put it. Link to comment Share on other sites More sharing options...
Renegade605 Posted March 22, 2009 Share Posted March 22, 2009 In certain cases, authors may specify the value of an attribute without any quotation marks. The attribute value may only contain letters (a-z and A-Z), digits (0-9), hyphens (ASCII decimal 45), periods (ASCII decimal 46), underscores (ASCII decimal 95), and colons (ASCII decimal 58). We recommend using quotation marks even when it is possible to eliminate them. All attribute values must be quoted, even those which appear to be numeric.I guess it all depends which language you're using. Link to comment Share on other sites More sharing options...
No Name At All Posted March 22, 2009 Share Posted March 22, 2009 This is hard, I'm current;y trying to use layers but then the hover doesn't work.... Link to comment Share on other sites More sharing options...
jeffman Posted March 22, 2009 Share Posted March 22, 2009 I guess it all depends which language you're using.In Driver's Ed., they teach you to use your turn signal before every turn, even if no one's there to see it. That way, the behavior is automatic, so when it needs to be correct, you don't have to waste time thinking and choosing. Same thing here. Just put the values in quotes every time. You'll always be right, and you'll never have to think about it. Link to comment Share on other sites More sharing options...
Synook Posted March 23, 2009 Share Posted March 23, 2009 SGML doesn't require quotes, XML does.And anyway, it's illegal to fail to indicate, even if no-one's around - you never know where the police are hiding Link to comment Share on other sites More sharing options...
Shade Posted March 23, 2009 Share Posted March 23, 2009 @jnf555 change the class name from a to something else , to avoid confusion with anchor tag. <!DOCTYPE html ><html> <head> <style type="text/css"> .mydiv { background-color : yellow; /* all the basic properties here */ width:300px; height:300px; /* you forgot : and; in the end */ } .mydiv:hover { background-color : blue; /* only properties you want to change on hover event */ } </style></head><body> <div class="mydiv"> hover over to change background color </div></body></html> you may also use <div id="mydiv">.... in HTML and #mydiv{..., #mydiv:hover.... in CSS. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.