Solved Weird behavior when scrolling on mobile version

Hi all.

I've been scratching my head with this problem for three days now.

While scrolling down and up on mobile, the background around the text that is in the fullwidth header module flashes.
And at the same time, the video is being redrawn, which serves as a background for this module. Strange behavior is observed only on mobile version.
For a section, the height calculation is in vh as follows:

Code:

Log In or Sign Up to view this code.

Code:

Log In or Sign Up to view this code.

But it doesn't help

What I did?

• Tried uploading video in smaller size (3mb)
• Added 'auto' to 'preload' (everything else from video tag is)
• Overlay a layer with a transparent image, since it seemed was related to touch event

Below is a some video:

1. Samsung Galxy A51 https://www.youtube.com/shorts/OgkCRYeAPCE
   
2. Iphone 12 Pro https://www.youtube.com/shorts/gLS3MqLrkAw
   
3. And web-page itself: https://suik.online/sample-page/ (I don't touch the main page yet.)

I apologize for providing little code, if some is needed, I will send it, I just don’t understand on which part of the code this bug is.

Help plz

 

UPD: Ive just removed one of the advice suggested here and the blinding effect has disappeared, but this does not solve the issue anyway.

Code:

Log In or Sign Up to view this code.

Why is this happening?

 

Topic can be closed