在窗口上向上/向下滚动无线电

时间:2018-01-28 08:03:33

标签: jquery html

我正在尝试切换单选按钮,因为用户会根据他们正在查看的部分向上/向下滚动页面。

它正确切换它们一次,但从不再检查if语句。

我使用Grid注册滚动位置并将其偏移。

div具有在函数调用中检查的ID

JSfiddle link here

1 个答案:

答案 0 :(得分:1)

无需为每个元素编写条件。您可以使用$(this)each() jQuery。

<强> Updated Fiddle

Stack Snippet

$(window).scroll(function() {
  $("#notfixed div").each(function() {
    if ($(window).scrollTop() > $(this).offset().top) {
      $("input[value=" + $(this).attr("id") +
        "]").prop("checked", true);
    }
  })
});
#fixed {
  position: fixed;
  top: 0;
}

#notfixed {
  padding-top: 20px;
}

div {
  height: 120vh;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="fixed">
  <label>
    <input type="radio" value="1" name="selection">1</label>
  <label>
    <input type="radio" value="2" name="selection">2</label>
  <label>
    <input type="radio" value="3" name="selection">3</label>
</div>

<div id="notfixed">
  <div id="1">1</div>
  <div id="2">2</div>
  <div id="3">3</div>
</div>