Панель поиска появляется на панели навигации при прокрутке вниз Bootstrap 4

Если вы создаете загрузочную навигацию с панелью поиска в ней, дайте панели поиска имя класса (в моем примере я выбрал .searchbar), затем добавьте этот javscript и css.

<script>  
  $(window).scroll(function() {    
        var scroll = $(window).scrollTop();

        if (scroll >= 500) {
            $(".searchbar").addClass("visible");
        } else {
            $(".searchbar").removeClass("visible");
        }
    });

</script>

.searchbar {
opacity: 0;
}
.visible {
opacity: 1;
}

Это сделает панель поиска невидимой изначально, а затем после прокрутки вниз (500 пикселей) добавится класс .visible, который сделает панель поиска видимой. Затем, если вы прокрутите назад выше 500 пикселей сверху, он удалит класс .visible, и панель поиска снова станет невидимой.