javascript - window.pageYOffset在javascript中显示不同的值

我可以使用Java脚本轻松地在网页中上下移动。我为此做了一个功能：

function moving() {
var move=window.pageYOffset;
move=move+950;
$("html, body").animate({scrollTop:  move  },0);
}

然后我有一些照片。所有图片具有相同的高度。我必须每个950px下移。它的效果很好，但经过3次移动后，其移动速度将超过950px。

我用alert(move);给我pageYOffset。它告诉我：

950 ... 1900 ... 2850 ... 3800 .. 4750 ... 5700

因此，它变为950px。但是，尽管我有相同高度的相同图像，但它不会与最后一张图像位于相同的位置。第三次之后，类似的东西比950px还要多，并且一切都会出错。

更新：

这是我拥有的图像的代码：

    <div align="center">
  <table width="1132" border="0">
    <tr>
      <td><img src="images/Look_01.jpg" width="566" height="849" /></td>
      <td><img src="images/Look_01.jpg" width="566" height="849" /></td>
    </tr>
  </table>
</div>
<div align="center"><img src="images/arrow_up.png" width="47" height="58" border="0" usemap="#Map" class="hover" />
  <map name="Map" id="Map">
    <area shape="rect" coords="4,4,44,54" href="#" onclick="up()"/>
  </map>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
<img src="images/arrow_down.png" width="47" height="58" border="0" usemap="#Map2" class="hover" />
<map name="Map2" id="Map2">
  <area shape="rect" coords="3,4,45,53" href="#" onclick="move()" />
</map>
</div>
<br/>
<br/>
<br/>
<br/>
<div align="center">
  <table width="1132" border="0">
    <tr>
      <td><img src="images/Look_01.jpg" width="566" height="849" /></td>
      <td><img src="images/Look_01.jpg" width="566" height="849" /></td>
    </tr>
  </table>
</div>

然后以相同的图片和相同的高度继续进行。但是，它不会与最后一张图片一样，但是每隔950px都会出现。

就像相册一样。所有图片都具有相同的高度，因此当我要下降时，我希望与上一张图片一样下降。但它搞砸了。第三次之后，它的下降幅度将超过950px，并且下降的幅度越来越大。

我真的希望你了解我的意思。

请帮助我，以便我可以解决此问题。

提前致谢。

最佳答案

这很简单。您必须在功能范围之外定义var scrolled = window.pageYOffset;。

同样，由于pageOffsetY的值您不知道它是否不同步。因此，每次下车时都需要减去15px。

因此，将您的代码更改为此：

var scrolled = window.pageYOffset;
function down(){
var scrolled = window.pageYOffset;
scrolled=scrolled+950;
$("html, body").animate({scrollTop:  scrolled  },2500);
scrolled = scrolled - 15;
}