Log in

View Full Version : Form Buttons Hover


Rockonmetal
03-27-2007, 09:14 PM
How do you change the color of the form button on the hover, i know how to do it on the static *when the mouse is not on it*

its CSS. here is what i have in the head (its all related to the button)

<style type="text/css">
/*IBW DESIGN */
/*MUST STAY IN CONTACT FOR USE! */
.menu{
background-color: #777777;
color: 000000;
font-family: Tahoma;
font-size: 14px;
width: 300px;
}
.menu input{
background-color: #888888;
border: 0px;
color: 000000;
font-family: Tahoma;
font-size: 14px;
}
.menu input:mouseover{
background-color: #000000;
border: 0px;
color: 000000;
font-family: Tahoma;
font-size: 14px;
}
</style>
thetestingsite
03-28-2007, 01:40 AM
Not 100&#37; sure on this, but shouldn't this part (the one in red):



.menu input:mouseover{
background-color: #000000;
border: 0px;
color: 000000;
font-family: Tahoma;
font-size: 14px;
}


be set as "hover" (without the quotes)?
Hope this helps.
jscheuer1
03-28-2007, 03:04 AM
That's right, thetestingsite:


.menu input:hover {
background-color: #000000;
border: 0px;
color: #000000;
font-family: Tahoma;
font-size: 14px;
}

And just to be safe, add the space before the brace as shown. However, this will not work for IE 6 and earlier. But, you can use javascript onmouseover and onmouseout events for those browsers if you like, or just not worry about them as, they are being phased out.

One more thing, with both the color and background-color #000000, the text (if any) will 'disappear' onmouseover.
Rockonmetal
03-28-2007, 05:25 PM
Thanks, I knew the text would dissapear, it was just in the testing stage.


BTW For some reason it doesn't work in IE 7, But it works in Fire Fox, Microsoft jeese, they can't do anything right, except for making computers,
mburt
03-28-2007, 06:08 PM
In IE, the hover class does not work. The only alternative for this is javascript.
boxxertrumps
03-28-2007, 06:10 PM
Microsoft doesn't sell any actual hardware.
Just under-par software.

but IE is a pain in the neck for most people who make web pages, ive tried to make up for it on my site (here (http://boxxer.mooo.com/)), but for some reason hr elements are styled differently in ie then gecko/khtml browsers.
also the fact that it refuses to be postitioned/given colored borders/margins...

i should try an empty div <div /> and see if it works the same...

Edit: Not even close...
jscheuer1
03-28-2007, 06:40 PM
It should work in IE 7, this does:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
input:hover {
color:red;
background-color:black;
}
</style>
</head>
<body>
<input type="button" value="hi">
</body>
</html>

But! The DOCTYPE is required!!
Sparaker
03-28-2007, 07:55 PM
Yeah running the webpage in quirks mode is not an option for stuff like this. ;)