Question

我知道如何因垂直滚动而引起动画，但是如何因水平滚动而导致动画？

Answer 1

同样，您收听滚动事件并观看window.scrollX

var item = document.getElementById("item")
window.addEventListener('scroll', function(e) {
  if (window.scrollX > 100) {
        item.classList.add('active')
  } else {
    item.classList.remove('active')
  }

});

body {
  overflow-x: scroll;
}

#item {
  width: 2000px;
  height: 200px;
  background-color: gold;
  transition: all .25s;
}

#item.active {
  background-color: red;
}

<div id="item"></div>

网站水平滚动激活动画

1 个答案: