Home » Jquery » javascript – How to load fixed header without page "jump" of the height of header?-Exceptionshub

javascript – How to load fixed header without page "jump" of the height of header?-Exceptionshub

Posted by: admin February 24, 2020 Leave a comment

Questions:

I have a question. I have a fixed header at my website. When I scroll a page about 400-500 pixels this header appears on the page. When it appears, there is a “jump” of the page equals to height of the header. This looks terrible. How to prevent this situation and load header without “jump” of page ?

This is a CSS for the header:

#header .header-top.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    margin: 0px;
    background: #FFF;
    padding: 3px 0px;
    z-index: 9999;
    left: 0px;
    border-bottom: 1px solid #ddd;
}

enter image description here

How to&Answer: