Tlačítka bez preloadu — příklad 2

HTML
<a class="button" href="#">Button<span></span></a>
<a class="button button2" href="#">Button 2<span></span></a>
<a class="button button3" href="#">Button 3<span></span></a>

CSS
a.button {
	display: block;	
	position: relative;
	margin: 0; padding: 0;
	width: 200px; height: 50px;
	cursor: hand; /*nastaveni rucicky pro IE 5.x*/
	overflow: hidden;
}
a.button span {
	display: block;
	position: absolute; left: 0; top: 0; z-index: 1;
	margin: 0; padding: 0;
	width: 200px; height: 50px;
	background: url('button.gif') left top no-repeat;
}
a.button2, a.button2 span {
	background: url('button2.gif') left top no-repeat;
}
a.button3, a.button3 span {
	background: url('button3.gif') left top no-repeat;
}
a.button:hover, a.button:hover span {
	background-position: 0 -50px;
}