Selvin
Selvin

Reputation: 12483

How to change a div background image while hover without jQuery?

I want to change the background of a DIV on hover event. Is there a way to do this using pure CSS?

Upvotes: 7

Views: 22975

Answers (1)

David Thomas
David Thomas

Reputation: 253308

Yeah, this is pretty easy with pure CSS, albeit IE6, if I remember rightly, doesn't support :hover on any elements except for a. But the following should work consistently in other browsers:

div {
    background: #fff url(path/to/image.png) 0 0 no-repeat;
}

div:hover {
    background: #ffa url(path/to/hoverImage.png) 0 0 no-repeat;
}

Upvotes: 9

Related Questions