Question

to change to

when mouse over.. like you can do with a:hover, how can i do this?

I tried

addFriend img:hover{
    background: url(images/addFriend_hover.png);
}

Answer 1

Ditch the img tag, and do it without javascript

(off the top of my head, untested)

HTML

<div class="addFriend"><a href="addfriend.html">Add Friend</a></div>

CSS

.addFriend { background: url(images/addFriend.png); }
.addFriend:hover { background: url(images/addFriend_hover.png); }