[4.2.x]

Интересное решение которое можно поставить Vb4 (сам пока не ставил)
Источник: http://udomovogo.rusff.ru/viewtopic.php?id=859

Данный скрипт хорош тем, что когда страница поднята вверх - кнопка "Вверх" скрыта, когда внизу - скрыта кнопка "Вниз", причем параметры высоты, на которой появляются кнопки регулируется.
ДЕМО

ПЕРВЫЙ ВАРИАНТ
В HTML-верх ставим сами кнопки

<div class="go-up" title="Вверх" id='ToTop'>?</div>
<div class="go-down" title="Вниз" id='OnBottom'>?</div>

и так же код оформления и расположения кнопок

<style>
.go-up,.go-down {
display:none;
position:fixed; /*позиционируем*/
right:5px; /*указываем положение, если слева - left*/
z-index:9999; /*показываем поверх все элементов на странице*/
background:#4F4F4F; /*фон кнопок*/
border:2px solid #ccc; /*толщина, стиль, цвет рамки*/
box-shadow:0 10px 0.3em -0.1em rgba(0,0,6,0.5); /*тень*/
border-radius:10px;
cursor:pointer;
color:#fff; /*цвет стрелок*/
text-align:center; /*выравнивание*/
font-size:42px; /*размер стрелок*/
text-shadow:0 1px 2px #000, 0 0 10px #E0F1FF;
opacity: .7; /*прозрачность*/
padding:0 3px 5px 3px; /*отступы внутри*/
margin-bottom:5px; /*отступ снизу (можно не указывать)*/
width:48px; /*ширина кнопки*/
height:48px; /*высота кнопки*/
}
.go-up {
bottom:70px; /*положение от низа окна браузера верхняя кнопка*/
}
.go-down {
bottom:10px; /*положение от низа окна браузера нижняя кнопка кнопка*/
}
/*стили при наведении курсора*/
.go-down:hover,.go-up:hover {
opacity:1;
}
</style>

В HTML-низ ставим сам скрипт jQuery

<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>

Значение 250 в скрипте, показывает: в первой строке - кнопка появится когда страница будет прокручена больше чем на 250 пикселей, а во второй, что исчезнет когда до верха будет меньше чем 250 пикселей.

ВТОРОЙ ВАРИАНТ
Вариант с кнопками картинками
HTML-верх

<!--кнопки вверх вниз-->
<div class="go-up" id='ToTop'><img src="ссылка на кнопку ВВЕРХ" border="0" /></div>
<div class="go-down" id='OnBottom'><img src="ссылка на кнопку ВНИЗ" border="0" /></div>
<style>
.go-up,.go-down {
display:none;
position:fixed; /*позиционируем*/
right:5px; /*указываем положение, если слева - left*/
z-index:9999; /*показываем поверх все элементов на странице*/
cursor:pointer;
opacity:.7; /*прозрачность*/
margin-bottom:5px; /*отступ снизу (можно не указывать)*/
width:30px; /*ширина кнопки*/
height:30px; /*высота кнопки*/
}
.go-up {
bottom:65px; /*положение от низа окна браузера верхняя кнопка*/
}
.go-down {
bottom:25px; /*положение от низа окна браузера нижняя кнопка кнопка*/
}
.go-down:hover,.go-up:hover {
opacity:1;
}
</style>

HTML-низ

<!--кнопки вверх вниз-->
<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>

Идея не плохая но без доработки не робит , так как данная функция добавлена в двиг и при добавлении в шаблон

<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>

пишет:
Следующая ошибка произошла при попытке проверить шаблон:
Parse error: syntax error, unexpected '(', expecting variable (T_VARIABLE) or '$' in /ssd/htdocs/includes/adminfunctions_template.php(3962) : eval()'d code on line 87

Originally Posted by diim

Parse error

это потому, что дебильный синтаксис жквери
в шаблонах, значок доллара => $ - воспринимается как переменная, а у жквери, это хрен пойми что, там и функция может быть и переменная...
нужно отделять мух от котлет, но кодеры жквери об этом не слышали

Попробуйте обрамить код тегом <vb:literal></vb:literal>.

Originally Posted by OldEr

Попробуйте обрамить код тегом <vb:literal></vb:literal>.

Не помогает :(

@diim, попробуйте в блоке с JS-кодом заменить все "$" на "jQuery".