Скрипты для сайтов — кнопка вверх
Скрипты для сайтов — кнопка вверх
Листинг кода
<style>
/*Back to top button */
#back-top{
position:fixed;
bottom:30px;
right: 60px; /*смещение на середину экрана*/
display: none; /*сначала скроем её*/
}
#back-top a{
width:64px;
display:block;
text-align:center;
font:11px/100% Arial, Helvetica, sans-serif;
text-transform:uppercase;
text-decoration:none;
color:#bbb;
/*при наведении мышки меняем фон медленно*/
-webkit-transition:1s;
-moz-transition:1s;
transition:1s;
}
/*при наведении мышки делаем фон черным*/
#back-top a:hover{
color:#000;
}
#back-top span{
width:64px;
height:64px;
display:block;
margin-bottom:7px;
background:#ddd url(images/up-arrow1.png) no-repeat center center;
/* скругляем углы */
-webkit-border-radius:15px;
-moz-border-radius:15px;
border-radius:15px;
/*при наведении мышки меняем фон медленно*/
-webkit-transition:1s;
-moz-transition:1s;
transition:1s;
}
#back-top a:hover span{background-color:#777}
</style>
<script type="text/javascript">
$(document).ready(function(){
// прячем кнопку #back-top
$("#back-top").hide();
// появление/затухание кнопки #back-top
$(function (){
$(window).scroll(function (){
if ($(this).scrollTop() > 100){
$('#back-top').fadeIn();
} else{
$('#back-top').fadeOut();
}
});
// при клике на ссылку плавно поднимаемся вверх
$('#back-top a').click(function (){
$('body,html').animate({
scrollTop:0
}, 800);
return false;
});
});
});
</script>
<p id="back-top">
<a href="#top"><span></span>Вверх</a>
</p>
Проверить работу скрипта можно в РЕДАКТОРЕ
Обмен визитами — бесплатная раскрутка сайта.
Самый простой способ, это по старинке, обмен визитами через ввод адреса сайта в форму:
Ссылка не должна превышать 200 символов и должна обязательно являться URL адресом. Без пробелов.
***
Трейн-чекс Уроки WEB программирования.
- ПОДДЕРЖАТЬ ПРОЕКТ на WebMoney
- WEST-HOSTER
- ПОРТАЛ СООБЩЕСТВА 🕶️
- HTML JS CSS РЕДАКТОР
- ШРИФТЫ ДЛЯ САЙТОВ
- ПРОМПТЫ ДЛЯ ШЕДЕВРУМА
- Символ неразрывного пробела
- Скрипт считывания клавиш
- Файлы куки
- AJAX счётчик кликов
- Запрет кэширования JS и PHP
- Координаты курсора JS
- Числа от 1 до 10 на JS
- Перевести двоичный код в кратный на JS
- CSS на JavaScript
- Новые теги HTML
- Может ли HTML 6 заменить JavaScript
- HTML форма без перезагрузки страницы
- Смайлы эмоджи — ГЕНЕРАТОР
- Форматы изображений
- Скрипт AJAX лайков и дизлайков
- Горячие клавиши
- Скачать изображение в CANVAS
- Какими будут сайты будущего?
- Что делает администратор сайта
- Девушка фурри Милка Маус
- CMS движки для сайтов
Мануалы PHP
- Мануалы PHP — Фильтры
- Мануалы PHP — Узнать IP адрес
- Мануалы PHP — Файлы папки директории
- Мануалы PHP — Вывод файлов scandir()
- Мануалы PHP — Отправка данных из формы
- Мануалы PHP — Запись данных в файл
- Мануалы PHP — Запрет повторной отправки формы
- Мануалы PHP — Дата и время
- Мануалы PHP — Отправка E-mail
- Мануалы PHP — Работа с изображениями
- Мануалы PHP — Вход по паролю
- Отправка формы AJAX
- Геолокация на PHP, узнать город
- Выполнение PHP скрипта по клику
- Маскировка ссылок
- Таблица умножения
Анимация JS
- Шифровка текста на JS
- Безумный текст
- Компрессор кода
- Уведомления на рабочий стол
- Перезагрузка на JS и PHP
- Рейтинг на JS и PHP
- Виджет комментариев на PHP
- Рекламный баннер на CSS
- Запрет копирования
- Узнать код клавиш
- Скрипт кода клавиш
- Конвертер кода в спецсимволы
- Бесконечный алерт
- Вывод случайных фраз
- Откуда пришёл посетитель на JS
- CSS type radio checkbox
- Эффекты с текстом
- Посетители онлайн на PHP
- Cookie счётчик посещений
- Анимация текста
- Type — range
- Лабиринт на JS
- Дата и время на JS
- CSS меню блокнот
- CSS меню книжная полка
- CSS вращающийся баннер
- JavaScript азбука морзе
- JavaScript копирайт
- JavaScript анимация текста
- JavaScript звуки
- Кнопка вверх
- Подсчёт символов на JavaScript
- Работа с куками на PHP
AXAJ -JS
- AJAX счётчик кликов
- Генератор случайных чисел
- PHP счётчик страниц
- PHP запись файлов
- Дата посещения страницы на PHP
- Счётчик лайков на PHP
- Дата изменения страницы
- Игра JS — угадай число
- Круговое меню для сайта
- Навигатор
- Запрет копирования
- Вычислить дату на JS
- Кнопка на CSS
- view-source: исходный код
- Анимация JS
- Время проведённое на сайте
- Календарь JS
- Снег для сайта
- Анимация волны
- Добавить в избранное
- Срок жизни сайта
- Таймер на JS
- Блокировка мыши и клавиатуры
- Приветствие по времени суток
- JS время
- Яндекс поиск
