Кнопка Наверх для uCoz
Уделять внимание оформлению кнопки особо не будем. Вы можете сделать кнопку в виде направленной наверх стрелки, можете нарисовать ракету и т.д. Как реализовать суму функцию?
Можно, конечно, сделать якорь к верхней части, но это будет не очень хорошо. Во-первых, якорь штампует страницы, и когда пользователь в браузере нажимает кнопку для возврата, он попадает на эту же страницу. Чтобы сделать кнопку Наверх для uCoz, нам не нужны дополнительные плагины, здесь достаточно использовать маленький код на jQuery.
Скрипт обеспечивает плавный скроллинг к началу страницы. Можно сделать так, чтобы переход к началу длился пару секунд, а можно, чтобы он был мгновенным, но анимация все-таки просматривалась. Лучше установить сто миллисекунд.
Вот такой значок будет появляться в правом нижнем углу сайта при прокрутке:
Особенно спросом пользуется вид кнопки наверх ВКонтакте, такой у нас уже был. Здесь же более простой вариант, в котором достаточно заменить маленькую картинку, чтобы придать уникальности
Установка
Этот код вставьте в нижнюю часть сайта:
<script type="text/javascript">
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() > 300) $('a#move_up').fadeIn(200);
else $('a#move_up').fadeOut(400);
});
$('a#move_up').click(function () {
$('body,html').animate({
scrollTop: 0
}, 800);
return false;
});
});
</script>
В Таблицу стилей (CSS):
Используемое изображение рекомендуем скачать на свой сайт.
Если большая часть страниц на вашем сайте вписывается в окно браузера, то в кнопке Наверх нет никакого смысла. Определите этот момент, нужна ли вам эта кнопка.