javascript - 在滚动条上切换数字和运行功能

Question

我如何在点击和滚动时在这些数字之间切换类...？所以，基本上我想在旋转鼠标滚轮时在它们之间切换，然后触发某种回调......

编辑:所以，我希望能够在窗口中的任何位置移动鼠标滚轮，这将反过来切换 li 中的 .active 类。此外，例如选择 li#runOne 时，它​​应该运行一个回调函数，比方说 runFunctionOne。当 li#runTwo 被选择/滚动到 - 它会运行例如 runFunctionTwo ...

$("#runTwo").on('click', function() {
  $("#runTwo").toggleClass("active", function() {
    // Run some callback
    console.log("Two");
  });
});

$(window).scroll(function() {
  // Switch between numbers on scroll
});

ul {
  margin: 50px auto;
  width: 300px;
}

.active {
  background-color: lightblue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li id="runOne" class="runOne active">Run 1</li>
  <li id="runTwo" class="runTwo">Run 2</li>
  <li id="runThree" class="runThree">Run 3</li>
</ul>

Answer 1

您可以像这样使用单击和鼠标滚轮来切换类

https://codepen.io/creativedev/pen/rKOBEq

$('.rr').on('click, mousewheel', function() {
          $('.rr').removeClass('active');
         $(this).addClass('active');
            console.log("Two");
});