Я использую Bootstrap и имею следующий код:
<nav class = "navbar">
...
</nav>
<div class = "progress-bar">
...
</div>
Я хочу установить верхнее значение .progress-bar равным высоте навигационной панели. Как я могу этого добиться?
Поместите его в элемент навигационной панели (или прямо под ним) и настройте стиль для его поддержки.
var navbarHeight = $('.navbar').height();
var progressBar = $('.progress-bar');
progressBar.css("top", navbarHeight);
.container {
position: relative;
}
.navbar {
height: 500px;
background: yellow;
}
.progress-bar {
width: 100%;
height: 500px;
position: absolute;
background: red;
}
<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class = "container">
<nav class = "navbar">
...
</nav>
<div class = "progress-bar">
...
</div>
</div>
К сожалению, с Javascript или фиксированной высотой.