Imagen con ":hover"

[rube]

hola nuevamente,
Tengo un problema, vi una pagina que euiero copiar los estilos para un Boton q es es una imagen, y cuando el mouse para sobre el boton la imagen cambia de color.

Bueno lo que hice fue compiarme la imagen y compiarme los estilos con firebug, pero no logro obtener el efecto si alguien me ayudara..

esta es la pagina: http://www.buzzdash.com/index.php?page=category&C_id=5

aqui esta el link de la imagen http://i.buzzdash.com//lang/en/bbt/1/bb_but_public_com.gif

bueno y aqui esta el estilo:

Código:

.buzzbite a.bb-but-com {buzzbite.css (line 54)
background-image:url(bb_but_public_com.gif);
}
.buzzbite a.bb-but-com, .buzzbite img.bb-but-com-spacer {buzzbite.css (line 234)
width:60px;
}
.buzzbite .actions a {buzzbite.css (line 204)
background:transparent none no-repeat scroll left bottom;
display:block;
float:left;
height:15px;
margin-right:5px;
}
.buzzbite a, .buzzbite a:hover {buzzbite.css (line 25)
border:medium none;
text-decoration:none;
}
a {page_style.css (line 11)
text-decoration:none;
}

bueno se q lo tengo todo para hacer, pero no logro obtener lo q deseo, tansolo q aparezcan las dos imagenes.

tambien tengo mi codigo de Html. q lo llama a mi .css

Bueno espero q me ayuden
Gracias

[Avatar810]

Que tal, aqui te dejo un tema anterior, ahi se dicen sugerencia de javascript y de CSS

http://www.forosdelweb.com/f53/onmouseover-imagenes-560087/

[Mikmoro]

Es que has copiado mal los estilos. Si has usado el mismo html, es decir, si conservas las clases y demás tal cual, prueba así:

.buzzbite a.bb-but-com {background-image:url(bb_but_public_com.gif);
}
.buzzbite a.bb-but-com, .buzzbite img.bb-but-com-spacer {width:60px;
}
.buzzbite a.bb-but-com:hover {background-position: left bottom;
}
.buzzbite .actions a {background:transparent none no-repeat scroll left bottom;
display:block;
float:left;
height:15px;
margin-right:5px;
}
.buzzbite a, .buzzbite a:hover {border:medium none;
text-decoration:none;
}
a {text-decoration:none;
}