Кнопка Вверх для сайта

Привет, Гость!

Регистрация

Страница 1 из 1
1

Форум » Мусорка » Корзина [архив] » Кнопка Вверх для сайта (кнопка прокрутки страницы сайта вверх)

serfer

Дата: Вторник, 11.11.2014, 18:38 | Сообщение # 1

Сержант

Группа: Пользователи

Сообщений: 12

Награды: 0

Репутация: 2

Статус: Offline

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

Для этого им всего лишь нужно будет нажать данную кнопку

,которая будет находиться в нижнем правом углу экрана вашего сайта,после чего страница будет сама плавно прокручиваться вверх.

Установка:
Заходите в Панель Управления вашего сайта - Дизайн - Управление дизайном (CSS) - Нижняя часть сайта.

И в самый низ вашего кода вставляете этот скрипт:

Код

<a href="javascript://" onclick="$('body').scrollTo({top:$('body').offset().top, left:0}, 1500);return false;">
<div style="position:fixed; opacity:0.8; bottom:0px; right:0px;" id="fImgtotop">
<img title="Вверх" src="http://www.wse-online.ru/knopka_vverkh-2.jpg" width="45" border="0"></div></a>

Для регулировки прозрачности кнопки (чтоб она лучше вписывалась в ваш дизайн),нужно изменить в скрипте эту часть
- opacity:0.8

Регулировка от 0.1 (почти прозрачная) - до 0.9 (не прозрачная)

Если нужно немного увеличить или уменьшить кнопку - измените это значение в коде : width="45"

Сообщение отредактировал serfer - Воскресенье, 15.02.2015, 08:59

serfer

Дата: Пятница, 20.02.2015, 18:39 | Сообщение # 2

Сержант

Группа: Пользователи

Сообщений: 12

Награды: 0

Репутация: 2

Статус: Offline

Вот еще один скрипт кнопки вверх, его отличие от первого в том что кнопка будет появляться при прокручивании страницы вниз и исчезать после прокручивания страницы вверх.

Так же ставим скрипт в нижнюю часть сайта:

Код

<a style='position: fixed; bottom: 0px; right: 0px; cursor:pointer; display:none;' href='#' id='Go_Top'>
<img src="http://www.wse-online.ru/knopka_vverkh-2.jpg" width="45px" alt="Наверх" title="Наверх"></a>
<script type="text/javascript">
jQuery(function(){
$("#Go_Top").hide().removeAttr("href");
if ($(window).scrollTop()>="250") $("#Go_Top").fadeIn("slow")
$(window).scroll(function(){
if ($(window).scrollTop()<="250") $("#Go_Top").fadeOut("slow")
else $("#Go_Top").fadeIn("slow")
});
$("#Go_Top").click(function(){
$("html, body").animate({scrollTop:0},"slow")
})
});
</script>

Форум » Мусорка » Корзина [архив] » Кнопка Вверх для сайта (кнопка прокрутки страницы сайта вверх)

Страница 1 из 1
1

Навигация

Развлечения

Новое на форуме

Всплывающий мини-профиль для uCoz

(0)

Всплывающее окно ajax - Оповещение о ЛС - Новое персональное

(1)

Многофункциональный мини-профиль для uCoz

(1)

Корпус водяного насоса.Чертёж формат А1

(2)

Вопросы для экзамена по предмету "ТО автомобилей"

(3)

Кнопка Вверх для сайта

(1)

Переработанный всплывающий мини-чат для uCoz

(7)

Экономическая теория

(0)

Флеш часы на сайт

(0)

Новогодние флеш часы на сайт

(0)

Опрос

Общение

Загрузка…

Статистика

Зарег. на сайте
Всего: 267
Новых за месяц: 0
Новых за неделю: 0
Новых вчера: 0
Новых сегодня: 0
Из них
Администраторов: 1
Модераторов: 0
Проверенных: 1
Обычных юзеров: 264
Из них
Парней: 234
Девушек: 33

Друзья сайта

Возможен баннерообмен 81х31.Писать ЛС.