@Kvolity

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

Здравствуйте, как сделать кнопку вверх на wordpress (куда вставлять код именно)? Чтобы была плавная и цвеn при наведении изменялся. Нашёл статью в гугле, но куда вставить код так и не разобрался Bibletumb. Спасибо.
  • Вопрос задан
  • 103 просмотра
Пригласить эксперта
Ответы на вопрос 1
AntonLitvinenko
@AntonLitvinenko
HTML coder
Кнопка вставляется обычно в footer.php, в любое место - она ведь фиксированная.

<button class="to-top">Up</button>

.to-top {
	position: fixed;
	right: 30px;
	bottom: 30px;
	width: 40px;
	height: 40px;
	text-align: center;
	font-size: 0;
	z-index: 50;
	opacity: .7;
	color: #000;
	background-color: orange;
	transition: all 0.25s;
	transform: translateX(100px);
}

.to-top::before {
	content: "";
	width: 14px;
	height: 14px;
	border: 2px solid #000;
	border-left: 0;
	border-bottom: 0;
	ransform: rotate(-45deg);
	position: absolute;
	top: 16px;
	left: 13px;
}

.to-top.active {
	transform: translateX(0);
}

.to-top:hover {
	opacity: 1;
}

$('.to-top').on('click', function() {
	$('body, html').animate({ scrollTop:0 },800);
	return false;
});

$(window).scroll(function() {
	if($(this).scrollTop() > 100) {
		$('.to-top').addClass('active');
	} else {
		$('.to-top').removeClass('active');
	}
});
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
YCLIENTS Москва
от 200 000 до 350 000 ₽
Ведисофт Екатеринбург
от 25 000 ₽
ИТЦ Аусферр Магнитогорск
от 100 000 до 160 000 ₽