change height of div with scroll in javascript

1$(window).on('scroll', function () {
2    var scrollTop = $(window).scrollTop();
3    if (scrollTop > 50) {
4        $('#header_parent').stop().animate({height: "30px"},200);
5    }
6    else {
7         $('#header_parent').stop().animate({height: "50px"},200);   
8    }
9});