When scrolling, the screen size changes how to fix it?

Question

css

Good day!
There was such a problem. The background of the page is a picture on a fixed block, height 100%. On the phone, when scrolling up, the browser's auxiliary menu appears and the window size changes. When I scroll down, this browser menu disappears, and that place remains white until I stop scrolling and the block changes its hat to fill this white space. I tried to set a fixed hat, taking into account the white space. Does not help. I couldn't find a solution on google. Maybe someone has already encountered this?
Thank you!

Answer 1

jquery $(window).resize() tried?
https://api.jquery.com/resize/

Answer 2

make a fixed block not height 100% but
margin auto
top 0
right 0
left 0
bottom minus the height of the helper menu