HTML Code

<script>
jQuery(document).ready(function($){
var mywindow = $(window);
var mypos = mywindow.scrollTop();
mywindow.scroll(function() {
if (mypos > 40) {
if(mywindow.scrollTop() > mypos)
{
$('#stickyheaders').addClass('headerup');
}
else
{
$('#stickyheaders').removeClass('headerup');
}
}
mypos = mywindow.scrollTop();
});
});
</script>

<style>
#stickyheaders{
-webkit-transition: transform 0.34s ease;
transition : transform 0.34s ease;
}
.headerup{
transform: translateY(-110px); /*adjust this value to the height of your header*/
}
</style>