我有一个用bootstrap 4制成的固定导航栏。当我向下滚动页面时,我想减小导航栏的高度。当我尝试向下滚动页面时。高度不会降低。以下是我的浏览器的视频链接
我已经尝试过的一些代码
$(document).ready(function() {
$('.nav-button').click(function() {
$('.nav-button').toggleClass('change');
});
$(window).scroll(function() {
var position = $(this).scrollTop();
if (position >= 200) {
$('.nav-menu').addClass('.custom-navbar');
} else {
$('.nav-menu').removeClass('.custom-navbar');
}
});
});Run Code Online (Sandbox Code Playgroud)
body {
font-family: 'Montserrat', sans-serif;
}
/* Header */
header {
height: 100vh;
background: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, .5)), url(images/header-img.jpeg) no-repeat center center/cover;
}
/* Navbar */
.nav-menu {
background: linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .5));
padding: 30px;
transition: all .7s;
}
.menu-item {
font-size: …Run Code Online (Sandbox Code Playgroud)