Scrolling will cause each element to sway vertically.
Even if I erased each element one by one, there was no shaking.
The page is here.
https://unagi-ryousin.com/
To check the phenomenon, scroll down and then immediately return to the top to shake the page vertically. In particular, it is easy to understand by scrolling the part of the image where the products are lined up below "Popular products with a lot of depth". Only the TOP page is generated.
It may not be directly related, but
Chrome DevTools has the following warning:
Each dictionary in the list "icons" should contain a non-empty UTF8 string field "type".
There is a page with the same content below, but I can't find the item by searching with icons.
@cubick Thank you. Since the cause has not been identified, it is difficult to give the relevant code. To check the phenomenon, scroll down and then immediately return to the top to shake the page vertically. It is especially easy to understand if you scroll the part of the image around where the products are lined up.
Macc2022-02-13 23:25:25Why don't you try debugging by narrowing down the code until the phenomenon is reproduced? First of all, how about reducing DOM elements from full full HTML, CSS and javascript, or excluding Javascript that seems to be unrelated, and aiming to create a minimal source that does not occur when the behavior is deleted. Is not it?
keitaro_so2022-02-13 23:25:25The source code is too long to read, but when the header is off, isn't the value of the position property no longer absolute or fixed? If so, each time you scroll to switch the header display, the entire document will shift by the height of the header.
supa2022-02-13 23:25:25Thank you, @keitaro_so. I understand what you mean. When I reduced the DOM elements, I found that the header was probably influential. thank you.
Macc2022-02-13 23:25:25- javascript : VueJS Outputting html through a function
- javascript : Why is the page not scrolling to the anchor?
- When hovering over one block, did the position of other blocks change (javascript)?
- javascript : How to change the color of the scale in the video?
- javascript : Stroke for JS script elements
- javascript : $("#element").va() returns an empty string, but if this is written in the console (ctrl+shift+i), then the correct
- drag &drop in javascript
- javascript : Regex how to parse a string
- javascript : What to do with the "restart" button?
Instead of just pointing to the URL of the page, include the (minimal) code that reproduces the problem directly in your question.
cubick2022-02-13 23:25:25