MENU

スライダ―を入れるとアンカーリンクがずれる

ページ内のアンカーリンクだと問題ありませんが、別ページからのアンカーリンクだと、アンカーの場所がおかしくなってしまうことがあります。

これは、スライダーで使っているjQueryやcssが読み込まれる前にアンカーリンクが着地するためです。

先にロードしてJavascriptやCSSを読み込ませた後にアンカーリンクに着地するようにしてあげると解決されます。

 

<script>
$(window).on('load', function() {
    var hash = window.location.hash;
    var position = $(hash).offset().top;
    function scroll(position){
      $('html, body').animate({
        scrollTop : position
      }, 100);
    }
    scroll(position);
  });
</script>

 

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

40代webクリエイター
1人が好き、家が好き、副業と投資でお金貯めてます
31歳で貯金200万円、41歳で2000万円、43歳で2400万円達成中

コメント

コメントする

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

目次