javascript – The navigation bar should only show when I scroll, but is already visible when I refresh the page, then disappears when scrolling

I’m creating a page where the navigation bar should only appear after scrolling a few thousand pixels. But when I refresh the browser, the navigation bar appears first and disappears as soon as I start scrolling. After that everything works as intended.

How can I make the bar hidden when the page is refreshed?

Here the JS code I have used:

<script src=""></script>

    <script type="text/javascript">
            if( $(this).scrollTop() > 4000){
              $('#navigation').fadeIn( "slow", "linear" )
            } else {
              $('#navigation').fadeOut( "slow", "linear" )

Here the CSS code I have used:

nav ul {
        list-style: none;
        width: 1100px;
        height: 40px;
        margin: 30px 222px auto;
        padding: 20px 20px 20px 20px;
        background-color: #798c39;
        text-align: center;

Source link

Latest articles

Related articles

Leave a reply

Please enter your comment!
Please enter your name here