И так начнем: Открываем наш стиль, в самый низ в globalTemplate ставим этот код:
<a href="#" class="scrollup">Наверх</a>
Это в custom css:
.scrollup{
width:40px;
height:40px;
opacity:0.3;
position:fixed;
bottom:50px;
right:100px;
display:none;
text-indent:-9999px;
background: url('icon_top.png') no-repeat;
}
При помощи этого кода кроме внешнего вида мы определяем позицию кнопки и задаем отступы 100 px с права и 50 px снизу.
Теперь подключаем библиотеку, если она еще не подключена для вашего сайта. Для этого между тегами <head>...</head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
Затем сразу после подключения библиотеки необходимо в globalTemplate расположить следующий код JQuery:
<script type="text/javascript"> $(document).ready(function(){ $(window).scroll(function(){ if ($(this).scrollTop() > 100) { $('.scrollup').fadeIn(); } else { $('.scrollup').fadeOut(); } }); $('.scrollup').click(function(){ $("html, body").animate({ scrollTop: 0 }, 600); return false; }); }); </script>
И так же Вам понадобится изображение самой стрелки:
От Sipsb
Рекомендуемые комментарии
Комментариев нет
Создайте учетную запись или войдите, чтобы комментировать
Вы должны быть пользователем, чтобы оставить комментарий
Создать аккаунт
Зарегистрируйтесь для получения аккаунта. Это просто!
Зарегистрировать аккаунтВойти
Уже зарегистрированы? Войдите здесь.
Войти