ScrollTop JS版

ScrollTop 和轉換Class Name純JS版

by wales

HTML

<div class="onlinestore">
  123

</div>

CSS

.onlinestore {
  color: red;
  height: 500px;
}

.onlinestore-fixed {
  background-color: blue;
}

JavaScript

var element = 'onlinestore';
var className = 'onlinestore-fixed';
window.addEventListener("scroll", function(event) {
  var top = (window.pageYOffset || document.scrollTop) - (document.clientTop || 0);
  if (top >= 20) {
    document.getElementsByClassName(element)[0].className = element + " " + className;
  } else {
    document.getElementsByClassName(element)[0].className = element;
  }

})