円滑なスクロール機能を使用するときに、navbarの高さを考慮する方法

Question

リンクをクリックしたときにページの特定のセクションにスクロールするスムーズなスクロール機能があります。しかし、自動的にセクションにスクロールすると、固定されたナビゲーションバーの高さが考慮されず、コンテンツの一部が隠れてしまいます。私は、ナビゲーションバーの高さを計算し、私の現在の機能あなたがscrollTop: target.offset().topにあなたのナビゲーションバーの高さを追加する必要が

$(function() { 
    $('a[href*="#"]:not(.carousel-control)').click(function() { 
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
    var target = $(this.hash); 
    target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
    if (target.length) { 
    $('html, body').animate({ 
     scrollTop: target.offset().top 
    }, 1000); 
    return false; 
    } 
} 
    }); 
}); 

Answer 1

内のスクロール位置からそれを減算したいと思います。これは整数値で、navbar DOM要素自体の.height()を参照するだけで計算できます。ここで

はnavbarのクラスでナビゲーションバーを想定した例です：

scrollTop: target.offset().top + $('.navbar').height() 

は、この情報がお役に立てば幸い！ :)