The script responsible for the appearance of the element when scrolling does not work?

Question

JavaScript

Here is the site xxx.devshift.co.uk .
here is the script I am using

<script> 
        $(window).scroll(function(){ 
        if($(window).scrollTop()>595){ 
        $('#menu-fixed').css('display','block'); 
        }else{ 
        $('#menu-fixed').css('display','none'); 
        } 
        }); 
        </script>

The script is quite simple, but the element that should be hidden is still displayed and hidden after a small scroll and after 595px appears again. Here is the element that should be hidden in the photo. If you scroll down a little and immediately up, it will disappear and appear according to the script. But I can not understand why it is displayed immediately. because he shouldn't. Prescribed the script wherever possible did not help
. Is it possible that this is due to the fact that the element initially has display: flex; ???

Answer 1

What does "immediately" mean? Before scroll? Well, he's supposed to change it only after scrolling.

$( document ).ready(function() {
 $('#menu-fixed').hide(); 
     $(window).scroll(function(){ 
        if($(window).scrollTop()>595){ 
        $('#menu-fixed').show(); 
        }else{ 
        $('#menu-fixed').hide(); 
        } 
        }); 
});

or don't touch js and default to .css

#menu-fixed {
display: none;
}