add a class or remove it based on window scroll location

add a class or remove it based on window scroll location Demo

View Demo Full Screen View Demo New Tab

add a class or remove it based on window scroll location Code

HTML

<div class='header'>This is the .header div</div>

CSS

.header {
background:#000;
color:#FFF;
padding:10px;
}
.header-stick {
font-weight:bold;
}

Javascript

$(window).scroll(function() {
  if ($(document).scrollTop() > 50) {
    $('.header').addClass('header-stick');
  } else {
    $('.header').removeClass('header-stick');
  }
});