Смяна на бекгрунд на бутон

[proba]

Здравейте.
Да речем имам един:

<input type="submit" name="submit" value="Login">

и css

input
{
with: 100px;
height: 21px;
background: url('login.png');
}

Как може да стане когато си сложа мишката върху бутона , background-a му да се сменя ? Примерно с картинката login2.png
И като махна мишката пак да е с нормалния background ?

 

[shterev]

input:hover
{

background: url('login-hover.png');

}

Така става, но не работи в ИЕ6. а и е добре да го направиш с клас

 

[proba]

Да , то попринцип е .login input
Сега ще опитам

EDIT:
При мене не работи и под IE 8..
Няма ли поне някакъв js код за тази работа.. ? :|

 

[Fakeheal]

Това е rollover с JS, ако искаш да направиш това де.

<a href="ЛИНКА ТИ" onmouseover="image1.src='линк на img-a, когато мишката е отгоре';"
onmouseout="image1.src='другата снимката-когато мишката не е отгоре ';">
<img name="image1" src="каринката,когато мишката е отгоре (отново)" border=0></a>

 

[proba]

@Fakehal , въпросът е че е бутон (submit) а не линк.
EDIT:

Идея как да се промени за да работи на submit ?

 

[shterev]

<input type="submit" onmouseover="this.style.background:' url(image)'; "  onmouseout=" this.style.background:' url(image-2)';  "/>

Провери синтаксиса,че може да има грешка

 

[sharky_design]

<input class="button" type="submit" name="submit" value="Login">

и css

.button{
width: 100px;
height: 21px;
background: url('login.png');
}
.button:hover {
width: 100px;
height: 21px;
background: url('login2.png');
border: none;
}

 

[proba]

@sharky_design , това вече ми го даде @shterev , но през IE6,7,8 не излиза.
Сега ще опитам с кода от предпоследното мнение.

EDIT:

@shterev , и с това не стана.
Можеш ли да го пробваш при тебе , и после да го дадеш тук , като го направиш. Благодаря предварително

 

[shterev]

@sharky_design , това вече ми го даде @shterev , но през IE6,7,8 не излиза.
Сега ще опитам с кода от предпоследното мнение.

Я си дай точно кода, защото :hover на ие8 съм сигурен ,че бачка

 

[proba]

За hover съм го махнал , понеже не бачкаше.
А това е за самият бутон

.log input
{
margin-top: 5px;
width: 75;
height: 23;
color: #000000;
background: url('login.png');
border: 0px;
}

 

[shterev]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>ff</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
	
.submit{
	margin-top: 5px;
	width: 75px;
	height: 23px;
	color: #000000;
	background: #ff0000;
	border: 0px;
} 

.submit:hover{
	background:#000;
}
</style>
	</head>
	<body>
		<input onmouseover="this.style.background='url(image-2.gif)';" onmouseout="this.style.background='url(image.gif)';"  class="submit" type="submit" value="send"/>
	</body>
</html>

Сега кажи ,че не работи и ще се гръмна, честно Просто image.gif и image-2.gif си сложи твоите картинки както и в css-a

 

[proba]

Получи се , недей да стреляш
Благодаря

 

[shterev]

:?: