Safariにてトップページ以外の固定ページからトップページのページ内リンクを押すと表示位置がずれて表示される

0
いいねをした人: 居ません
7件の投稿を表示中 - 1 - 7件目 (全7件中)
  • 投稿者
    投稿
  • #135797
    SNM-FUN
    閲覧者
    20

    【お使いの Snow Monkey のバージョン】 25.2.6
    【お使いの Snow Monkey Blocks のバージョン】 20.4.1
    【お使いの Snow Monkey Editor のバージョン】 9.3.2
    【お使いの PHP のバージョン】7.4.30
    【お使いのブラウザ】 Safari
    【当該サイトのURL】 直接状況を見ていただきたく、共有したいのですが、外部から依頼された開発中の未公開のサイトであるため、本フォーラムにて公開的に共有ができません。

    ### 発生している問題
    Safariにて、トップページ以外の固定ページからトップページのページ内リンクを押すと本来表示されるはずのセクションが映らないぐらい、表示位置がずれて表示されます。なおページ内リンクはヘッダー・フッター・ドロワー内に設置しており、u-smooth-scrollクラスを各メニューに付与し、スムーススクロールで遷移されるようにしております。

    <ページ内リンクを作成した方法>
    トップページの各セクションのHTML アンカーにて、たとえば「about」と記入し、それに対応するメニューに対してはWordPressの外観>メニュー画面にて、カスタムリンクでメニューを作成し、URL部分に「/#about」を入力、CSS classには「u-smooth-scroll」を入力しております。

    ### 試したこと
    上記現象はChromeでは起きず、Safariにておきます。

    0
    いいねをした人: 居ません
    #135806
    キタジマ タカシ
    参加者
    2201

    以下教えてください。

    – スムーススクロールを使用しない場合はどうなりますか?
    – ページを(ハードリロードなどでキャッシュを消さずに)リロードしたあと、再度リンクをクリックすると改善されますか?
    – ページを一度一番下までスクロールして、一番上まで戻った後、再度リンクをクリックすると改善されますか?
    – 画像を非同期読み込みするようなプラグインあるいは JavaScript のライブラリーを使用していますか?

    0
    いいねをした人: 居ません
    #135816
    SNM-FUN
    閲覧者
    20

    ご返信いただき誠にありがとうございます。回答させていただきます。

    – スムーススクロールを使用しない場合はどうなりますか?
    →改善されません

    – ページを(ハードリロードなどでキャッシュを消さずに)リロードしたあと、再度リンクをクリックすると改善されますか?
    →トップページから別の固定ページに移動し、リロードした後、リンクを押しましたが、改善されません

    – ページを一度一番下までスクロールして、一番上まで戻った後、再度リンクをクリックすると改善されますか?
    →改善されません

    – 画像を非同期読み込みするようなプラグインあるいは JavaScript のライブラリーを使用していますか?
    <使用しているプラグイン>
    All-in-One WP Migration
    BackWPup
    EWWW Image Optimizer
    SEO SIMPLE PACK
    My Snow Monkey
    Snow Monkey Blocks
    Snow Monkey Editor
    Snow Monkey Forms
    Snow Monkey Google Fonts
    WP Multibyte Patch

    jQuery使用

    0
    いいねをした人: 居ません
    #135821
    キタジマ タカシ
    参加者
    2201

    – スムーススクロールを使用しない場合はどうなりますか?
    →改善されません

    ありがとうございます。となると、スムーススクロールの問題ではなさそうですね。

    – ページを(ハードリロードなどでキャッシュを消さずに)リロードしたあと、再度リンクをクリックすると改善されますか?
    →トップページから別の固定ページに移動し、リロードした後、リンクを押しましたが、改善されません

    – ページを一度一番下までスクロールして、一番上まで戻った後、再度リンクをクリックすると改善されますか?
    →改善されません

    画像の非同期読み込みがあるとズレることがあるっぽいのでその可能性を考えたのですが、これもなさそうな気がしますね…。

    – 画像を非同期読み込みするようなプラグインあるいは JavaScript のライブラリーを使用していますか?
    <使用しているプラグイン>
    All-in-One WP Migration
    BackWPup
    EWWW Image Optimizer
    SEO SIMPLE PACK
    My Snow Monkey
    Snow Monkey Blocks
    Snow Monkey Editor
    Snow Monkey Forms
    Snow Monkey Google Fonts
    WP Multibyte Patch

    jQuery使用

    この中だと画像の読み込みに関連しそうなのは「EWWW Image Optimizer」ですが…停止すると何か変わったりしますか?あと、「jQuery使用」とありますが、非同期読み込み的なことに使っていますか?

    —-

    ちなみに、このサイトの場合だと、下記のページにある「目次」がページ内リンクになっています。僕の環境だと Chrome でも Safari でもずれに移動できましたが、これはどうですかね?下記のページでも同様に不具合が発生するなら Snow Monkey の何かに原因がある可能性が高いかなと。下記のページでは発生しないなら、ページの作り方や何らかの設定、ブラウザの何か…という可能性があるかもなと。

    0
    いいねをした人: 居ません
    #135877
    SNM-FUN
    閲覧者
    20

    ご返信いただき誠にありがとうございます。
    回答させていただきます。

    この中だと画像の読み込みに関連しそうなのは「EWWW Image Optimizer」ですが…停止すると何か変わったりしますか?

    無効化しましたが、改善されませんでした。

    「jQuery使用」とありますが、非同期読み込み的なことに使っていますか?

    いえ特に行っていない認識ですが、コードを共有した方がよろしいでしょうか。

    ちなみに、このサイトの場合だと、下記のページにある「目次」がページ内リンクになっています。僕の環境だと Chrome でも Safari でもずれに移動できましたが、これはどうですかね?下記のページでも同様に不具合が発生するなら Snow Monkey の何かに原因がある可能性が高いかなと。下記のページでは発生しないなら、ページの作り方や何らかの設定、ブラウザの何か…という可能性があるかもなと。

    私の環境でもそちらのサイトについては同じくずれずに両ブラウザで移動できました。また再度確認したところChromeでもずれていました、、、

    0
    いいねをした人: 居ません
    #135879
    SNM-FUN
    閲覧者
    20

    追加情報です。

    トップページ以外の固定ページから全ページ共通部分(ヘッダー・フッター)にあるトップページの各セクションのページ内リンクを押す際にずれが生じるのですが、ずれて表示されるセクションの1つ上のセクションにあるアコーディオンを開いた状態をオフにすると改善されました。開いた分だけずれているのでしょうか。

    また、実は再度確認したところトップページ以外の固定ページからだけでなく、トップページから同様ページ内リンクを押してもずれて表示されるリンクがあり、そちらはEWWW Image Optimizerの設定の1つである「遅延読み込み」をオンにして改善しました。

    0
    いいねをした人: 居ません
    #135882
    キタジマ タカシ
    参加者
    2201

    ずれて表示されるセクションの1つ上のセクションにあるアコーディオンを開いた状態をオフにすると改善されました。開いた分だけずれているのでしょうか。

    僕のローカル環境で試してみたのですが、初期表示を開いた状態にしたアコーディオンを3つ並べて、そのすぐ下の見出しにスムーススクロールさせてみたのですが、特に問題なくスクロールされました。

    ちょっと再現ができないとわからなさそうです…。依頼を受けてつくっているサイトとのことなので、テキストや画像を全部ダミーに差し替えた、実際に挙動を確認できるページを見せてもらうことってできますかね?

    0
    いいねをした人: 居ません
7件の投稿を表示中 - 1 - 7件目 (全7件中)
  • このトピックに返信するにはログインが必要です。

ドキュメント

Snow Monkey の設定方法やマニュアルを掲載しています。

ドキュメント

フォーラム

Snow Monkey の使い方やカスタマイズについてのご質問・ご要望等はサポートフォーラムで行っています。サポートフォーラムは誰でも閲覧できますが、書き込みできるのは Snow Monkey 購入者のみとなります。

サポートフォーラム

よくあるご質問

Snow Monkey のサービスについて不明な点がある場合は、まずはよくあるご質問をご確認ください。

よくあるご質問

お問い合わせ

よくあるご質問を見ても解決しなかった場合、試用版の申請については問い合わせフォームからお願いいたします。

お問い合わせ

Snow Monkey は Gutenberg ブロックエディターに対応した 100%GPL の WordPress テーマです。拡張性を意識した開発をおこなっており、カスタマイザーとブロックでスピーディーにサイトを立ち上げるだけでなく、CSS やフックを駆使した高度なカスタマイズにも柔軟に対応できます。