I want to hide the logo in the header section while scrolling

I have an image in my header section. I want to hide that image while scrolling and at the same time I want my header section to be re-sized. Thanks in advance.

<header class="show-for-large-up medium-12 columns sticky statichead">

                    <div class="logo large-5 columns text-left logo_imagel"> 
                        <a href="<?= $url ?>nodes/nodes/home"><img src="<?= $url ?>croogo/img/mantis_logo.png" alt="Ipagemakers"></img></a>

                    </div> 
                    <nav class="large-7 columns text-right">
                        <ul id="menu-main-menu-1" class="main-nav">

                            <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-169"><a href="<?= $url ?>nodes/nodes/home" class="animsition-link">Home</a></li>
                            <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-173"><a href="<?= $url ?>nodes/nodes/service" class="animsition-link">Services</a></li>
                            <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-172"><a href="<?= $url ?>nodes/nodes/portfolio" class="animsition-link">Portfolio</a></li>
                            <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-171"><a href="<?= $url ?>nodes/nodes/contact" class="animsition-link">Contact</a></li>
                            <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-170"><a href="<?= $url ?>nodes/nodes/blog" class="animsition-link">Blog</a></li>

                        </ul> 
                    </nav> 
                </header>


<script>
  $(window).scroll(function(){

   var scroll = $(window).scrollTop();                

   if (scroll > 0 ) {
       $('header').addClass('scrolled');
   }

    if (scroll <= 0 ) {
      $('header').removeClass('scrolled');
    }

});
</script>

and my css for scrolled

    .scrolled {
  opacity: 0.8;
  height: 50px;
  line-height: 50px;
}