var header = document.getElementById("header_parent");
window.onscroll = function(e) {
if(window.scrollY) {
if(window.pageYOffset > 50) {
header.style.height = 30;
} else {
header.style.height = 50;
}
}
}
$(window).on('scroll', function () {
var scrollTop = $(window).scrollTop();
if (scrollTop > 50) {
$('#header_parent').stop().animate({height: "30px"},200);
}
else {
$('#header_parent').stop().animate({height: "50px"},200);
}
});