I have encountered a strange issue where hiding a div at the bottom of a page causes the overall height of the document to shrink.
Interestingly, when I scroll all the way down to the bottom of the page before hiding the div, Chrome correctly adjusts the document's bottom to match the window's bottom edge.
However, if I don't scroll all the way down and leave even a single pixel below the window's bottom edge before hiding the div, Chrome fails to adjust the document's bottom accordingly. Instead, the document shrinks and reveals Chrome's grey fabric background. Only when I scroll the page by just a pixel does Chrome readjust the document to fit the window again.
This issue can be replicated on any website using Chrome's Dev Tools. Simply scroll almost to the bottom, select an element, and set its display to none or height to 0.
I am using Chrome 29 on OS X 10.8.4. Has anyone else experienced this bug?
A temporary solution I found is to use jQuery's scrollTop function to scroll up by a pixel after hiding the element. This seems to prompt Chrome to readjust the document.
var y = $(window).scrollTop();
$(window).scrollTop(y-1);
Now, the challenge arises when I attempt to use jQuery's slideToggle() to hide the element. Any suggestions for handling this situation?