0

スクロールすると各要素が縦に揺れます。
各要素を一つずつ消してみても、揺れはなおりませんでした。
ページはこちらです。
https://unagi-ryousin.com/
現象の確認方法としては、下にスクロールさせてから上にすぐ戻すと、ページが縦に揺れます。特に「量深の人気商品」より下の、商品が並んでいる辺りの画像の部分をスクロールしてみると分かりやすいです。TOPページのみ発生しています。

直接関係ないかもしれませんが、
Chrome DevToolsに下記の警告が出ています。
Each dictionary in the list "icons" should contain a non-empty UTF8 string field "type".
下記に同じ内容のページがありますが、iconsで検索しても該当の項目は見つかりません。
https://stackoverflow.com/questions/66171107/each-dictionary-in-the-list-icons-should-contain-a-non-empty-utf8-string-field

7
  • 1
    単にページの URL を指し示すだけではなく、問題の再現する (最小限の) コードを質問中に直接含めてください。
    – cubick
    Commented 2022年2月9日 4:00
  • @cubick 様 ありがとうございます。原因が特定できていないため、該当のコードをお伝えするのが難しいです。現象の確認方法としては、下にスクロールさせてから上にすぐ戻すと、ページが縦に揺れます。特に商品が並んでいる辺りの画像の部分をスクロールしてみると分かりやすいです。
    – Macc
    Commented 2022年2月9日 4:36
  • 現象が再現されるまでコードを絞っていくデバック作業をしてみてはいかがでしょうか?まずはフルフルのHTMLとCSSとjavascriptから、DOM要素を減らしていったり、関係ないと思われるJavascriptを除外して、動作がどのソースを削除すると発生しなくなるかミニマムなソースの作成を目指してはいかがでしょうか?
    – keitaro_so
    Commented 2022年2月9日 5:44
  • 1
    ソースコードが長大すぎて読めていないのですが、 ヘッダーが消えている状態のとき、 position プロパティの値が absolutefixed ではなくなっているのではないでしょうか?もしそうならば、ヘッダーの表示が切り替わるようなスクロールをするたびに、ヘッダー分の高さだけ文書全体がずれる動作になります。
    – supa
    Commented 2022年2月9日 9:33
  • @keitaro_so 様、ありがとうございます。仰っている意味が理解できました。DOM要素を減らしてみると、おそらくヘッダが影響していることがわかりました。ありがとうございます。
    – Macc
    Commented 2022年2月10日 22:02

0

この質問に回答するには、ログインする必要があります。

のタグが付いた他の質問を参照する。