SOLVED: Sticky header: style broken when refreshing page

Bugs
1

Bricks Version: 1.4

Hi,

I know it’s a minor aesthetic thing, but when refreshing a page after scrolling down, only .sticky class is applied to header on reload, causing wrong styling on header.

So at page load, some JS should detect if scroll is at top the page (check window.pageYOffset), and apply:

  • .sticky .scrolling if page is scrolled
  • .sticky if top of page
2

Temporary fix:

window.addEventListener('DOMContentLoaded', ()=> {

	if ( window.pageYOffset > 0 ) {
		let header = document.getElementById('brx-header');
		header.classList.add('scrolling');
		header.classList.remove('slide-up');
	}

});
1 Like
3

Hi,
Thanks so much for your report and the proposed solution. We’ll take care of it.

Best regards,
timmse

4

Hello Yan

We’ve included a fix for this in the Bricks 1.5 release.

If the fix isn’t working as expected, please let me know here.

Thank you!
Luis