Si vous souhaitez qu'il reste collant lorsque vous faites défiler jusqu'à un certain point, vous pouvez utiliser cette fonction :

$window = $(window);
$window.scroll(function() {
  $scroll_position = $window.scrollTop();
    if ($scroll_position > 300) { // if body is scrolled down by 300 pixels
        $('.your-header').addClass('sticky');

        // to get rid of jerk
        header_height = $('.your-header').innerHeight();
        $('body').css('padding-top' , header_height);
    } else {
        $('body').css('padding-top' , '0');
        $('.your-header').removeClass('sticky');
    }
 });

et cours collant :

.sticky {
  position: fixed;
  z-index: 9999;
  width: 100%;
}

Vous pouvez utiliser ce plugin, il propose quelques options utiles

Titre collant jQuery

Ajouter en CSS

position: fixed;

à votre élément de titre. C'est vraiment aussi simple que cela. La prochaine fois, essayez de cliquer avec le bouton droit sur quelque chose que vous voyez sur un site Web et de sélectionner « Inspecter l'élément ». Je pense que tous les navigateurs modernes l'ont désormais. Fonctionnalité très utile.