Change position of Menu or Div when mouse scroll above than a fixed height.

Let we want to change the menu position by default from the top:101px ,  but when you scroll the mouse greater than the 50px of window height, menu top position should be change to top:0px; . so for that we have coded here :

HTML=>

 <div class="subAboutHeader">
  <h2>About The Page</h2>
 
</div>

JS=>

window.onscroll = function() {posChange()};

function posChange(){
if(window.pageYOffset > 50){
$('.subAboutHeader').css({"top" : "0px"});
}
else{
$('.subAboutHeader').css({"top" : "101px"});
}
}