Jumping Header

Hi there,

I have a new issue where my header loads with a large height, and then when other content on the page has loaded it shrinks back to the height it should be. You should be able to check out the issue at the live site www.rasepro.com

The issue happens on both browsers i’ve tried, and happens on all pages. I have had a hunt for topics on similar issues, but most relate to the whole bar moving on scroll.

Much appreciated.
James

Hello James,

The issue is a combination of your logo size and lazyload function. Try to turn of lazyload and try again.

Just to explain what is happening here, your original logo size is 8694 x 2548. Too large for a logo. On load, lazyload function works that’s why you don’t see the logo right away but it occupies space already, then the actual CSS is not yet in effect because it was still loading. Once the CSS loads completely, width is set for you container and logo that’s why is it shrinks to preferred height. Look at this: https://screencast-o-matic.com/watch/cYfDonz3Aw. Please use a more appropriate width for the logo image.

Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.