Teacher of Computing | Create a Rollover with HTML and CSS @AhcMeUk | Uploaded 8 years ago | Updated 1 hour ago
The HTML / CSS method uses an image sprite to load all the rollover effects as a single image then CSS creates the rollover effect.

The CSS:
a.rollover {
display: block;
width: 150px;
height: 44px;
text-decoration: none;
background: url("rolloverimage.jpg");
}

a.rollover:hover {
background-position: -150px 0;
}

.displace {
position: absolute;
left: -5000px;
}