jdunhin
Active member
- Joined
- Feb 27, 2013
- Messages
- 72
- Points
- 0
Hi
Sharing a tip for developers
I am using sprite images and when I hover it just use the bottom part of the image. This is very handy to speed up your website or blog.
CSS:
#ID {
width: 136px; //SIZE OF THE ONE PART OF THE IMAGE
height: 48px;
background-image: url("THE-IMAGE");
background-position: top; //TOP PART OF IMAGE
display: block; //MAKE THE IMAGE A LINK
}
#ID:hover {
background-position: bottom; //BOTTOM PART OF THE IMAGE
}
HTML:
<a id='ID' href="http://LINK"> </a>
Sharing a tip for developers
I am using sprite images and when I hover it just use the bottom part of the image. This is very handy to speed up your website or blog.
CSS:
#ID {
width: 136px; //SIZE OF THE ONE PART OF THE IMAGE
height: 48px;
background-image: url("THE-IMAGE");
background-position: top; //TOP PART OF IMAGE
display: block; //MAKE THE IMAGE A LINK
}
#ID:hover {
background-position: bottom; //BOTTOM PART OF THE IMAGE
}
HTML:
<a id='ID' href="http://LINK"> </a>
