Updating the DOM causes scrolling issues


#1

Upon page load the HTML scrolls as you would expect. However, once the user logs in, and the DOM is updated (meaning the #pre-login div is removed) the page no longer scrolls and the scrollbar no longer exists. Not sure why this is happening. Anyone else seen this kind of thing?

{{# if currentUser}}
{{else}}
<div id="pre-login" class="form-group disabled">
	<label>Login or create an account</label>
	<div id="login-pick" class="btn-row">
		[...]
	</div>
</div>
{{/if}}

#2

Is the page content shorter than the viewport height when the div is removed? Other than that, can’t say without seeing more.

Also, you can do {{unless currentUser}} instead of if/else with an empty block.


#3

No, it’s still taller than the viewport size.

Thanks for the {{#unless}} hint though. :smile:


#4

I’m afraid I can’t really offer any more help then without seeing the rest of the markup/styles, unless there’s some strange, known issue relating to template re-rendering that I’m unaware of.

Maybe someone else can think of something.


#5

Is this happening on all browsers?


#6

It’s happening in Chrome, Firefox and Safari.