Стильная кнопка поднятие вверх сайта uCoz
Сейчас трудно представить сайт где много материала без функций кнопка вверх. И здесь вы можете себе взять и установить на свой сайт со сменой самой кнопки. Чтоб сделать ее рабочей здесь не нужно больших кодов, все обойдется в рамках jQuery. Также здесь будет присутствовать плавный скроллинг, но с разбегом небольшим. Вообщем про тематику говорить не нужно, а вот ставить или нет, здесь решает нужно по формату сайта. Если колонки большие и нужно пролистать долго, то конечна лучше воспользоваться этой функцией. Установка: Этот код вставьте в нижнюю часть сайта: Код <a class="h-top-link" id="move_up"></a> <script type="text/javascript"> $(function () { $(window).scroll(function () { if ($(this).scrollTop() > 300) $('a#move_up').fadeIn(); else $('a#move_up').fadeOut(400); }); $('a#move_up').click(function () { $('body,html').animate({ scrollTop: 0 }, 800); return false; }); }); </script> В Таблицу стилей (CSS): Код .h-top-link, .h-top-link:hover {display:none;cursor:pointer;width:48px;line-height:48px;text-align:center;background:#1d76d9 url('http://zornet.ru/Ajaxoskrip/Fekstura_tekst/demo/0489952001463261439.png');color:#fff;position:fixed;right:30px;bottom:30px;} Сама кнопка находится в стилях и идет одной ссылкой, просто если не устроила или по дизайн не подходит, то можете что то свое установить оригинальное. |
Поделиться в социальных сетях
Материал разместил
Комментарии: 8 | |
| |