How to shrink navbar on scroll ?

Shrink navbar on scroll 

<style>
.nav_logo_scroll{

width: 120px !important;
    transition: all 0.5s linear;
margin-left: 45px
}
.jassi{

width: 100% !important;
  transition: all 0.5s linear;
}
</style>


<script>
jQuery(document).ready(function($){


$(window).scroll(function() {
if($(document).scrollTop() >=1) {
$('.nav').css('position','fixed');
$('.nav_logo').addClass('nav_logo_scroll');
$('.nav_logo').css(' transition','all 0.5s linear');
$('.nav_logo').removeClass('jassi');
}
else if($(document).scrollTop() < 250) {
{ 
$('.nav').css('position','relative');
$('.nav').css(' transition','all 0.5s linear');
$('.nav_logo').removeClass('nav_logo_scroll');
$('.nav_logo').addClass('jassi');
}
}
});

});


</script>