Покрутка по блокам мышью html
я использую Scrollspy из bootstrap, нажимая на определенные ссылки происходит автоматическая прокрутка до блока, как добавить возможность прокрутки по блокам с помощью мыши. Если я нахожусь в самом верху, скролю вниз и автоматически переходит на 2 блок
<nav class="navbar navbar-expand-md fixed-top py-3 mx-4">
<h3 class="col-md-4 mb-0 text-body-secondary">Сайт</h3>
<div class="col-md-4 d-flex align-items-center justify-content-center mb-3 mb-md-0 me-md-auto"></div>
<ul class="nav nav-pills col-md-4 justify-content-end">
<li class="nav-item"><a href="#item-1" class="nav-link active" aria-current="page">ссылка 1</a></li>
<li class="nav-item"><a href="#item-2" class="nav-link">ссылка 2</a></li>
<li class="nav-item"><a href="#item-3" class="nav-link">ссылка 3</a></li>
<li class="nav-item"><a href="#item-4" class="nav-link">ссылка 4</a></li>
<li class="nav-item"><a href="#item-5" class="nav-link">ссылка 5</a></li>
</ul>
</nav>
<div data-bs-spy="scroll" data-bs-target="#navbar-example3" data-bs-smooth-scroll="true" class="container" tabindex="0">
<div id="item-1" style="height: 95vh; ">
<h4>ссылка 1</h4>
</div>
<div id="item-2" style="height: 95vh; ">
<h4>ссылка 2</h4>
</div>
<div id="item-3" style="height: 95vh; ">
<h4>ссылка 3</h4>
</div>
<div id="item-4" style="height: 95vh; ">
<h4>ссылка 4</h4>
</div>
<div id="item-5" style="height: 95vh; ">
<h4>ссылка 5</h4>
</div>
</div>