While implementing curtain effect for one of my customers' website, I came across the issue of setting margin on the body based on the footer's height. However, the footer height would change every time the window was resized and the initial set margin didn't work anymore. So, the margin had to be recalculated as reassigned with change in window width.
Executing a function while the window is being resized is both pointless and requires a lot of computational power. I came across a blog post by Alvaro Trigo which addressed this issue.
All we need to do in this case is to set a variable on which timeout would be assigned and while the window is being resized the timeout would be cleared and only if the user is done resizing or pauses for about a second (based on example above), will the function execute. The code can be found here.
.png)