Слов в тексте – 103, время чтения в минутах – 1
Для создания кнопки ⬆️, которая позволит быстро вернуться на верх страницы, можно воспользоваться следующими кодами.
CSS
#scrollToTop {
position: fixed;
bottom: 20px;
right: 20px;
background: #ff6f61;
color: #fff;
padding: 10px 15px;
border-radius: 50%;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
cursor: pointer;
display: none;
transition: all 0.3s ease;
}
#scrollToTop:hover {
background: #e64a19;
}
HTML – добавить примерно такую кнопку
<div id="scrollToTop" onclick="window.scrollTo({ top: 0, behavior: 'smooth' });">
↑
</div>
Небольшой фрагмент JavaScript
document.addEventListener('scroll', () => {
const scrollToTop = document.getElementById('scrollToTop');
scrollToTop.style.display = window.scrollY > 200 ? 'block' : 'none';
});
⬇ Поделиться в соцсетях и мессенджерах
Популярные записи
Рубрики блога
CSS (20) Фрагменты кодов (17) Плагины (10) WordPress (7) Разное (5) Ненужные советы (4) Шорткоды (4) Виджеты (3) Юмор (2)
