Scrollify.js を使ったページにアンカーリンク遷移できません

実現したいこと

質問させてください。現在Scrollify.jsというプラグインを使ってページを作成しているのですが、別ページからScrollify.jsを使用したページ内の指定ID位置に移動させることができず困っております。
Scrollify公式サイト → https://projects.lukehaas.me/scrollify/#home

以下のように トップページ（index.html）に Scrollify.js を設置しました。アクセスの位置にはid="access"というふうにアンカーを設置しています。

html

1<!-- index.html -->2<div class="section">3section1 4</div>5 6<div class="section">7section2 8<a href="detail.html">詳細ページへ</a>9</div>10 11<div id="access" class="section">12アクセス 13</div>14 15<div class="section">16section4 17</div>18 19<script src="https://code.jquery.com/jquery-3.6.3.js" integrity="sha256-nQLuAZGRRcILA+6dMBOvcRh5Pe310sBpanc6+QBmyVM=" crossorigin="anonymous"></script>20<script src="https://cdnjs.cloudflare.com/ajax/libs/scrollify/1.0.21/jquery.scrollify.min.js"></script>21<script>22$(function() {23 $.scrollify({24 section : ".section",25 });26});27</script>

css

1.section {2 background-color: #fcc;3}4.section + .section {5 margin-top: 100px;6}

次に詳細ページ（detail.html）からトップページ内のアクセスの位置に移動させたいのでindex.html#accessというリンクを配置しました。

html

1<!-- detail.html -->2<a class="btn" href="index.html#access">TOPアクセスへ</a>

しかしリンクをクリックするとトップページには遷移するのですが、アクセスの位置に移動せずURLもindex.html#accessとはならず（一瞬だけアドレスバーに表示されます）、index.html#1に変わってしまいます。

試したこと

scrollify が原因でアンカーリンクが機能しないのかと思い、こちらを参考にして以下のように scrollify を無効にしようとしたのですが上手くいきませんでした。

html

1<!-- detail.html -->2<a class="btn" href="index.html#access">TOPアクセスへ</a>3 4<script src="https://code.jquery.com/jquery-3.6.3.js" integrity="sha256-nQLuAZGRRcILA+6dMBOvcRh5Pe310sBpanc6+QBmyVM=" crossorigin="anonymous"></script>5<script src="https://cdnjs.cloudflare.com/ajax/libs/scrollify/1.0.21/jquery.scrollify.min.js"></script>6 7<script>8$('.btn').on('click', function(event) {9 if ($(this).toggleClass('scrollifyoff').hasClass('scrollifyoff')) {10 $.scrollify.disable();11 } else {12 $.scrollify.enable();13 }14});15</script>

どなたか解決方法をご存じの方がいらっしゃいましたら、ご教示いただけると助かります。
よろしくお願いいたします。