fixedになるとコンテンツの高さが変わる
最近ナビゲーション部分をウィンドウ上部までスクロールするとposition:fixedに切り替わってスクロール時に上部に配置され追随されるものがあるがWebページ内のナビゲーションがfixedに切り替わるとコンテンツから高さがその分引かれるためナビゲーションがアンカーリンク先への遷移の場合、正しく目的のところまで遷移できなくなってしまう。
例えばWebページ内の高さが2140pxでナビゲーションの高さが70pxのfixedになることで2140px-70px=2070pxとなりその分アンカーリンクの位置も変わるため正しく遷移できなくなる。
ナビゲーションの高さを取得して計算する
ナビゲーションの高さを取得してアンカーリンククリック時の移動位置を補正し、fixedになったときは失った高さ分を追加しておけば位置がずれることはなくなる。下記のサンプルではアンカーリンククリック時の移動位置アンカーリンククリック時の移動位置をナビゲーションの高さで引き、fixed時にナビゲーションの高さ分の空のdivを追加している。