Установка:
В CSS
Code
.otherbutton {
clear: both;
position:relative;
display:block;
height: 64px;
width: 570px;
background:url(http://ucozua.ru/Scripts/20/ajax/1c4c761cf33f.png) 0 0 no-repeat;
cursor: pointer;
}
.otherbutton span.hover {
position: absolute;
display: block;
height: 64px;
width: 570px;
background: url(http://ucozua.ru/Scripts/20/ajax/1c4c761cf33f.png) bottom no-repeat;
}
В head стави код:
Code
<script type="text/javascript">
$(document).ready(function() {
$('.otherbutton').append('<span class="hover"></span>').each(function () {
var $span = $('> span.hover', this).css('opacity', 0);
$(this).hover(function () {
$span.stop().fadeTo(500, 1);
}, function () {
$span.stop().fadeTo(500, 0);
});
});
});
</script>
$(document).ready(function() {
$('.otherbutton').append('<span class="hover"></span>').each(function () {
var $span = $('> span.hover', this).css('opacity', 0);
$(this).hover(function () {
$span.stop().fadeTo(500, 1);
}, function () {
$span.stop().fadeTo(500, 0);
});
});
});
</script>
Сама кнопка
Code
<a href="#" class="otherbutton"></a>
Готово!
Olezka[Материал]