Scroll page change color head-line dynamic

<header class="section header" data-color="dark">
	<div class="top_head">fixed</div>
</header>
<section class="section section-first" data-color="light"></section>
<section class="section section-second" data-color="dark"></section>
<section  class="section section-first" data-color="light"></section>
  
  
$(function() {

  var colorHelper = {
    init: function () {
      this._topY = 60,
      this.$header = $(".header");
      var e = this;
      $(window).on("scroll resize orientationchange", function () {
        e.update();
      })
     }, update: function (e) {
      this.$colorElements = $('.section').find("[data-color]").end();
      if (this.$colorElements && this.$colorElements.length !== 0) {
        var colorElementsLength = this.$colorElements.length;
        var scrollTop = $(window).scrollTop();
        if (this._prevScrollTop != scrollTop || e) {
          this._prevScrollTop = scrollTop;
          for (var n = Number.NEGATIVE_INFINITY, type = this.$colorElements.first().attr("data-color"), a = 0; colorElementsLength > a; a++) {
            var currentElement = this.$colorElements.eq(a);
            var offset = currentElement.offset().top - scrollTop;
            offset > n && offset < this._topY && (n = offset, type = currentElement.attr("data-color"))
          }
          (this._prevFoundedColor != type || e) && (this._prevFoundedColor = type, this.$header.removeClass("_light").removeClass("_dark").addClass("_" + type))
        }
      }
    }
  }

  colorHelper.init();

});