どでかいアコーディオンを含むページにアンカー付きで別ページか遷移した場合にピッタリあわせる

どでかいアコーディオンを含むページに
別ページからアンカー付きでブーンととんでくると
位置がずれる

アコーディオンはページロード後に非表示処理をするタイプ

コード

$(window).on('load.top', function(){
  /* ================================
    アンカーリンク付きでページヘ遷移
  ================================ */
  var hash = location.hash;
  if (hash) {
    $('.js-acd').removeClass("is-open");
    var $hash = $(hash).find('.js-acd').addClass("is-open");

    setTimeout(function(){
      // アコーディオン開閉後に再度スクロール
      var position = $hash.offset().top;
      $('body,html').animate({scrollTop:position}, 0, 'swing');
    }, 50);

  }

  /* ================================
    アコーディオン
  ================================ */
  $('.js-acd').each(function(){
    var $self = $(this);
    var $target = $($self.data('target'));

    if (!$self.hasClass('is-open')) {
      $target.hide();
    }

    $self.on('click.acd', function(){
      if ($self.hasClass('is-open')) {
        $target.slideUp();
        $self.removeClass('is-open');

      } else {
        $target.slideDown();
          $self.addClass('is-open');
      }
    });
  });
});

解説

1. ページ読み込み時にハッシュ付きURLだったら
2. 該当するアコーディオンを展開し
3. JSでページをスクロールして位置調整

setTimeout でスクロールのタイミングをずらしてるのが味噌

いろいろな処理が発生後にスクロールするようにし、中途半端な位置に移動するのを防ぐため