ヘッダー固定時のページ内リンク位置調整

$(function(){
    // #で始まるアンカーをクリックした場合に処理
    var headerHight = $('#header').height() + 10;
     $('a[href^="#"]').click(function() {
         var speed = 800; // ミリ秒
         var href= $(this).attr("href");
         var target = $(href == "#" || href == "" ? 'html' : href);
         var position = target.offset().top - headerHight;
         $('body,html').animate({scrollTop:position}, speed, 'swing');
         return false;
     });
 });

ヘッダー固定されているページにおいて
ページ内リンクを行うと移動先のコンテンツが、ヘッダーの裏に入ってしまうのを回避したい。

回避方法
①var headerHight = $(‘#header’).height() + 10; //ヘッダーの高さを取得 + 10px(任意)
コンテンツがヘッダー下部にピッタリの位置になるのを避けるために10px多くしています。

②var position = target.offset().top – headerHight;
スクロール移動位置(ターゲットのid)から(ヘッダーの高さ+10px)を引く

①②以外の箇所は一般的なページ内スクロールの書式なので割愛