scrollTrigger delay responsive (cause white space appear) when resizing browser

[WakuWakuCodingu]

Hi, recently i created a code with scrollTrigger. 

 

When I resize the browser to check for section responsive, there will white space that appear at right side of the browser briefly (shown as in the image attached).

 

When I didnt apply scrollTrigger, the white space wont appear and the section resize normally.

 

Is there anyway to solve this problem or reduce the white space effect

 

My english isnt that good, any help will be appreciated!  Thank you!

See the Pen mdgjxwB by WakuWakuCodingu (@WakuWakuCodingu) on CodePen

[Rogier Mechielsen]

Hi @WakuWakuCodingu,

 

Have you tried setting invalidateOnRefresh: true on your ScrollTrigger?

 

Best regards,

Rogier

 

[Cassie]

Hi there, am I correct that the white space only appears during the resize? If so that's just the browser recalculating and adjusting the layout.

 

I wouldn't see that as an issue. The only people that really resize browser windows are developers anyway! From years of bug testing websites and watching user journeys, the average user doesn't resize the browser, and if they do, they certainly don't care what the website looks like during resize. As long as the layout settles and is useable you're a ok.

[WakuWakuCodingu]

Hi, @Rogier Mechielsenand@Cassie,sorry for the late reply.

 

I already tried invalidateOnRefresh: true, but it still will leave some white space when resizing.

 

However,  I will be leaving the code as it be, just as Cassie said that it wont be any issue for normal user.

 

Nevertheless, thanks for both of your reply and advice.