<div class="wrap">
  <div class="info">0</div>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
  <p>111</p>
</div>

.wrap {
  padding-top: 50px;
}
.info {
  position: fixed;
  top: 0;
  left: 0;
  padding: 15px;
  text-align: center;
  width: 100%;
  background: #777;
  color: #fff;
  cursor: pointer;
  z-index:99;
}

var info = $('.info');
info.text(window.pageYOffset + ' px');

$(window).scroll(function () {
  info.text(window.pageYOffset + ' px');
});