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

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

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


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

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

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

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

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

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

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

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

Аватар пользователя Cka3o4H1k
Не в сети
Последнее посещение: 3 года 1 неделя назад
Зарегистрирован: 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
Не в сети
Последнее посещение: 1 год 16 недель назад
Зарегистрирован: 2014-08-03
Сообщения:
Баллы: 0.18
Спасибо вам. Вы мне очень

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

Реклама


| Почему выгодно использовать рекламу в Интернете | Развитие имиджа - распространение качественного автопостинга | Циркониевые коронки в Москве | Создание и продвижение сайтов | Эффективная печать и сканирование | Агентство интернет-маркетинга в Москве | Умное продвижение сайтов в ТОП! | Самые перспективные языки программирования: тройка лучших | Предоставление аренды VPS | Интернет-магазин товаров для животных Zoomark | Конструктор сайтов: хочу все знать | Услуги по продвижению сайтов | Как согласовать вывеску на фасаде магазина? | Полноценный сайт или лендинг пейдж | Покраска мебели в Москве | Колеса для тележек бортового питания | Поделки из проволоки своими руками | Лучшее турагентство в Киеве предлагает вам свои услуги | Как увеличить продажи установив виджет отзывов о компании | Покраска МДФ в Москве | Несколько альтернативных способов бросить свадебный букет в толпу незамужних подруг