Well here it is! (Apparently using CSS to achive a hover effect is far superior to using javascript, since JS can sometimes be turned off, thus rendering your rollover useless.)
Example
Original Image
CSS Code
1. a.rollover {
2. display: block;
3. width: 30px;
4. height: 30px;
5. text-decoration: none;
6. background: url("email.jpg");
7. }
8.
9. a.rollover:hover {
10. background-position: -30px 0;
HTML Code
Original Image
CSS Code
1. a.rollover {
2. display: block;
3. width: 30px;
4. height: 30px;
5. text-decoration: none;
6. background: url("email.jpg");
7. }
8.
9. a.rollover:hover {
10. background-position: -30px 0;
HTML Code
1. <a href="#" class="rollover"> </a>
Then adjust your images (60px high x 100px wide) and links as needed. It's so easy! Qs? Contact me.