起きている現象

ページでアンカーリンクを設置しているのですが、PCは問題なく遷移することができ、
スマホで閲覧時のみアンカーリンクをクリックすると一番上へ遷移してしまう現象が起きています。
※特定のページに限らず、アンカーリンクを設定しているすべてのページで起きています。

また、PCで見るとアンカーリンクをクリックした際にURL末尾が#〇〇と付くのですが、
スマホレイアウトの時には、クリックした際にURLが変わりません。

htmlの記述に問題はないようで、何が問題かわかる方いらっしゃいましたらご教示いただけますと幸いです。

■対象ページ
https://www.i-office1.net/feature/mattress_select/

html
1記述内容　例
2
3<a href="#mattress_a">詳細をみる</a>
4
5<div id="mattress_a">
6商品紹介
7</div>

#問題の発生した環境
スマホ閲覧時　※PCでスマホレイアウトにした際にも同様の事象が起きております。

runnynose

2021/07/02 03:48

私はPCでもうまくいってなかったのですが。。。 MacPC Chromeで見ました。

runnynose

2021/07/02 03:51

どうやらiPhoneだからというわけではなく、スマホレイアウトのときに発生している気がしますね。

0kawa9

2021/07/02 04:03

コメントありがとうございます。そのようですね…、PCのchromeでスマホにした際も同様の事象が起きております。 PCで見ると、アンカーリンクをクリックした際にURL末尾が#〇〇と付くのですが、スマホレイアウトの時には、クリックした際にURLが変わりません。 1ページのみでなく、すべてのページで効かなくなってしまっている為、困っております。。

行動規範の内容に同意します

回答1件

ベストアンサー

原因は以下のようでした。

対象箇所

https://www.i-office1.net/wp-content/themes/neruco/js/common.js
59-79行の処理

javascript
1    if (769 > $(window).width()) {
2        var hsize = $('.p-header-box__logo').innerHeight();
3        $('a[href^="#"]').click(function () {
4            var href = $(this).attr("href");
5            var target = $(href == "#" || href == "" ? 'html' : href);
6            var position = target.offset().top - (hsize + 20);
7            $("html, body").animate({
8                scrollTop: position
9            }, 550, "swing");
10            return false;
11        });
12    }