Как сделать кнопку "Наверх"?

Аватар пользователя crash
Не в сети
Последнее посещение: 46 недель 4 дня назад
Зарегистрирован: 2014-08-03
Сообщения:

Доброго времени суток уважаемые форумчане. У меня вопрос, который скорее всего интересует многих начинающих вебмастеров. Я часто встречаю кнопку "Наверх", наверняка и вы её не редко встречаете. Она очень удобна в использовании, и очень помогает при огромном тексте на страницах. Так вот, такую же кнопочку я решил добавить на свой сайт. Как её добавить? Какие коды нужно вписывать? И существует ли такой код в "html", или она работает только в "JavaScript"? Будет приятно познать этот маленький, но очень полезный скрипт.


Заранее спасибо, жду ответов...

Аватар пользователя tornado5
Не в сети
Последнее посещение: 5 недель 1 день назад
Зарегистрирован: 2014-06-24
Сообщения:
Для того, что бы что-то

Для того, что бы что-то конкретно вам посоветовать, нужно сразу знать в какой CMS вы работаете, либо вы используете чистый код. Например, для системы управления содержимым Joomla существует такой прекрасный плагин, как Smooth Top, который без проблем позволяет создать подобную кнопку.

Аватар пользователя Antuan
Не в сети
Последнее посещение: 3 года 7 недель назад
Зарегистрирован: 2014-05-28
Сообщения:
Наверх

Кнопка "наверх" может быть выполнена по-разному, независимо от вашей CMS. Можно просто в HTML добавить вниз страницы код типа:

<a href="#" title="вернуться в начало"class="topbutton">^Наверх</a>

и потом написать вид кнопки в CSS. Это самый простой и универсальный способ, который не перегрузит ваш код.

В вордпрессе и джумле есть готовые расширения и плагины для добавления такой кнопки. Далее, все сложнее- с использованием Javascript и других библиотек.

Аватар пользователя Cka3o4H1k
Не в сети
Последнее посещение: 3 года 19 недель назад
Зарегистрирован: 2014-08-06
Сообщения:
Если у вас уже подключена

Если у вас уже подключена jQuery, нужно сделать следующее: в scrollup.js добавляйте такой код:

jQuery( document ).ready(function() {

jQuery('#scrollup img').mouseover( function(){ jQuery( this ).animate({opacity: 0.65}, 100); }).mouseout( function(){ jQuery( this ).animate({opacity: 1}, 100); }).click( function(){ window.scroll(0, 0); return false; }); jQuery(window).scroll(function(){ if ( jQuery(document).scrollTop() > 0 ) { jQuery('#scrollup').fadeIn('fast'); } else { jQuery('#scrollup').fadeOut('fast'); } }); });
Аватар пользователя crash
Не в сети
Последнее посещение: 46 недель 4 дня назад
Зарегистрирован: 2014-08-03
Сообщения:
Спасибо вам. Вы мне очень

Спасибо вам. Вы мне очень помогли. Я установил данную кнопку у себя на сайте в тех местах, где очень большой объем текста, очень удобно пользоваться. Я буду ее немного редактировать, изменять вид, чтобы кнопка выглядела более красивой, а так все отлично. Хорошо, что есть этот форум и такие талантливые вебмастеры.