<!--кнопочки вверх вниз-->
<style>
.go-up,.go-down {
padding:0;
margin:0px;
display:block;
background-color:transparent;
outline: none 0 transparent;
border:none 0 transparent;
border-radius:10px;
cursor:pointer;
text-align:center; /*выравнивание*/
opacity: .7; /*прозрачность*/
width:46px; /*ширина кнопки*/
height:54px; /*высота кнопки*/
}
/*при наведении курсора*/
.go-down:hover,.go-up:hover {
opacity:1;
}
#wrp-butt{
overflow:hidden;
position:fixed; /*позиционируем*/
z-index:9999; /*показываем поверх всех элементов на странице*/
left:5px; /*указываем положение, если слева - left*/
bottom:300px; /*положение от низа окна браузера*/
}
</style>
<div id=wrp-butt>
<button class="go-up" id="ToTop" onmousedown="$('html,body').animate({scrollTop:0},{ 'duration': 1000, 'easing':'linear' });$(this).css({'margin':'1px -1px -1px 1px'});" onmouseup="$('html,body').stop(true);$(this).css({'margin':'0'})">
<img src="http://images.vfl.ru/ii/1415407369/37bb635b/6877738.png" alt="вверх" style="vertical-align: middle">
</button>
<button class="go-down" id="OnBottom" onmousedown="$('html,body').animate({scrollTop:$(document).height()},{ 'duration': 1000, 'easing':'linear' });$(this).css({'margin':'1px -1px -1px 1px'});" onmouseup="$('html,body').stop(true);$(this).css({'margin':'0'})">
<img src="http://images.vfl.ru/ii/1415407397/6c6953cd/6877739.png" alt="вниз" style="vertical-align: middle">
</button></div>