@deadshumz

Почему не работает скрипт при скроллинге?

Html
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<script>
		$(window).scroll(function(){
    		if ($(window).scrollTop() > 20) {
        		$('.navbar').addClass('scroll');
    		}
    		else {
        		$('.navbar').removeClass('scroll')
    		}
		});
	</script>
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
	<link rel="stylesheet" href="main.css">
	<title>devAid</title>
</head>
<body>
	<nav class="navbar navbar-top">
		<a href="#" class="nav-link"></a>
		<a href="#" class="nav-link"></a>
		<a href="#" class="nav-link"></a>
		<a href="#" class="nav-link"></a>
	</nav>
	<div class="container-fluid weldiv w-100"></div>
	<div class="next"></div>
</body>
</html>

CSS
body, html {
	height:100%;
}

.weldiv {
	background-color: #17BAEF;
	height:100%;
}
.navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
}
.navbar-top {
    background: #eee;
}
.next {
	height:1000px;
}
.scroll {
	background-color: red
}
  • Вопрос задан
  • 71 просмотр
Решения вопроса 2
wapster92
@wapster92 Куратор тега JavaScript
jQuery подключи перед скриптом.
Ответ написан
Комментировать
AntonLitvinenko
@AntonLitvinenko
HTML coder
И сам скрипт желательно завернуть в document.ready
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы