<!--- СТРЕЛКИ --->
<div class="go-up" id='ToTop'><img src="https://forumstatic.ru/files/001a/70/37/76487.png" border="0" width=100%/></div>
<div class="go-down" id='OnBottom'><img src="https://forumstatic.ru/files/001a/70/37/94471.png" border="0" width=100%/></div>
<style>
.go-up,.go-down { 
display:none; 
position:fixed; /*позиционируем*/ 
right:36px; /*указываем положение, если слева - left*/ 
z-index:9999; /*показываем поверх все элементов на странице*/ 
cursor:pointer; 
opacity:.7; /*прозрачность*/ 
margin-bottom:5px; /*отступ снизу (можно не указывать)*/ 
} 
.go-up { 
bottom:99px; /*положение от низа окна браузера верхняя кнопка*/
width:57px; /*ширина кнопки*/ 
height:57px; /*высота кнопки*/
} 
.go-down { 
bottom:85px; /*положение от низа окна браузера нижняя кнопка кнопка*/ 
width:50px; /*ширина кнопки*/ 
height:50px; /*высота кнопки*/
right:477px; /*указываем положение, если слева - left*/ 
}
.go-down:hover,.go-up:hover { 
opacity:1; 
}
</style>
<script type="text/javascript">
$(function(){
if ($(window).scrollTop()>="250") $("#ToTop").fadeIn("slow")
$(window).scroll(function(){
  if ($(window).scrollTop()<="250") $("#ToTop").fadeOut("slow")
  else $("#ToTop").fadeIn("slow")
});
if ($(window).scrollTop()<=$(document).height()-"999") $("#OnBottom").fadeIn("slow")
$(window).scroll(function(){
  if ($(window).scrollTop()>=$(document).height()-"999") $("#OnBottom").fadeOut("slow")
  else $("#OnBottom").fadeIn("slow")
});
$("#ToTop").click(function(){$("html,body").animate({scrollTop:0},"slow")})
$("#OnBottom").click(function(){$("html,body").animate({scrollTop:$(document).height()},"slow")})
});
</script>