ヘッダーがfixed固定のときにページ内リンクの位置を調節するJavaScript | サウウェブ

ヘッダーをposition:fixedで固定させたときに、ページ内アンカーリンクの位置がヘッダーに被ってしまうときの対策方法です。 cssで対処する方法がいろいろあるけれど、手っ取り早くヘッダーの高さ分調節する方法のjs対策を備忘録のために残しておきます。 スマホ表示の時にはアンカーリンクの位置をずらさない記述も書いています。 アンカーリンクの高さを調節するJavaScript ヘッダーの高さに応じてheaderHightの値を変更するだけです。 状況に合わせて「100」の値を変更してください。 $(document).ready(function() { var headerHight = 100; //ヘッダーの高さ $('a[href*=#]').click(function() { if (location.pathname.replace(/^\//,'') == this.pa