Плавающая кнопка для прокрутки страницы вверх — появляется при скролле вниз и плавно возвращает на начало
info Что делает этот скрипт
Добавляет на страницу кнопку «↑», которая появляется когда пользователь прокручивает страницу вниз более 300px. При клике — плавно скроллит страницу к самому верху. Работает на всех страницах uCoz, не конфликтует с другими скриптами.
avascript JavaScript — вставить перед </body>
back-to-top.js
content_copy Копировать// Кнопка «Наверх» для uCoz | uCoz Сборник
(function () {
var btn = document .createElement ('button' );
btn.id = 'uc-back-top' ;
btn.innerHTML = '↑' ;
btn.title = 'Наверх' ;
document .body.appendChild (btn);
window .addEventListener ('scroll' , function () {
btn.style.opacity = window .scrollY > 300 ? '1' : '0' ;
btn.style.pointerEvents = window .scrollY > 300 ? 'auto' : 'none' ;
});
btn.addEventListener ('click' , function () {
window .scrollTo ({ top: 0 , behavior: 'smooth' });
});
})();palette CSS — вставить в таблицу стилей
back-to-top.css
content_copy Копировать#uc-back-top {
position: fixed ;
bottom: 30px ;
right: 30px ;
width: 46px ;
height: 46px ;
border-radius: 50% ;
background: linear-gradient (135deg , #6366f1 , #8b5cf6 );
color: #fff ;
border: none;
font-size: 20px ;
font-weight: bold;
cursor: pointer ;
opacity: 0 ;
pointer-events: none ;
transition: opacity 0.3s , transform 0.2s ;
z-index: 9999 ;
box-shadow: 0 4px 15px rgba (99, 102, 241, 0.4);
line-height: 1 ;
}
#uc-back-top:hover {
transform: translateY (-3px );
box-shadow: 0 8px 25px rgba (99, 102, 241, 0.6);
}
Как установить 1
Открой редактор шаблонов uCoz Панель управления → Дизайн → Редактор шаблонов
2
Вставь CSS в таблицу стилей Общие шаблоны → Таблица стилей (CSS) — добавь в конец
3
Вставь JS в подвал сайта Глобальные блоки → Нижняя часть сайта — добавь JS перед </body>
4
Сохрани и проверь Нажми «Сохранить» в каждом шаблоне и проверь на сайте
check_circle Готово! Прокрути вниз — кнопка должна появиться. Если нет — проверь консоль браузера (F12) на синтаксические ошибки.
warning Важно: Не вставляй JS в <head> — это замедлит загрузку страницы. Скрипты всегда вставляй перед </body>.