Question

每当访问者滚动x个像素数量时，我想输出一个数组项。

此刻我想出了这段代码。但是当我只想输出某个项目时，我会被困住。

我想在每次有人滚动10 px数组的另一项时输出。

ec2-metadata

Answer 1

使用.scrollTop()方法：

if( $(document).scrollTop() > 10 ) {
    // do something
}
if ( $(document).scrollTop() > 20 ) {
    // do something
}

Answer 2

var arr = [1, 2, 3, 4, 5, 6, 7, 8];

document.onscroll = function() {
  var el = parseInt(window.scrollY / 250);
  if (el <= arr.length) {
    document.getElementsByTagName('p')[0].textContent += arr[el];
    arr[el] = '';
  }
}

html,
body {
  height: 200%;
}
p {
  position: fixed;
}

<p></p>

在上面的方法中，你在每个滚动上输出数组元素，除了在每次打印之后，你清除数组中的那个位置，所以你输出空白字符串（丑陋的黑客，但我只是想向你展示一般的想法）。 / p>

更改250中的parseInt(window.scrollY / 250)以更改步骤。

我希望你能够根据自己的需要应用这种方法。

如何在每次滚动时更改元素颜色

2 个答案: