“滚动值”不取决于窗口大小或屏幕分辨率。 “滚动值”只是滚动的像素数。
但是，您是否能够滚动以及滚动的量can滚动基于容器的可用空间和容器内内容的尺寸（在这种情况下，容器是document.documentElement, or document.body对于较旧的浏览器）。
你是对的scroll事件不包含此信息。它不提供delta属性来指示滚动的像素数。对于本土人来说确实如此scroll事件和 jQueryscroll事件。这似乎是一个有用的功能，类似于mousewheel事件提供 X 和 Y 增量的属性。
我不知道，也不会推测，为什么当权者没有提供一个delta财产为scroll，但这超出了这个问题的范围（请随意发布一个关于此的单独问题）。
您使用的存储方法scrollTop并将其与当前变量进行比较scrollTop是我发现的最好的（也是唯一的）方法。但是，您可以通过扩展 jQuery 以提供新的自定义事件来简化此操作，如本文所示：http://learn.jquery.com/events/event-extensions/ http://learn.jquery.com/events/event-extensions/
这是我创建的一个示例扩展，适用于窗口/文档滚动。这是一个名为的自定义事件scrolldelta自动跟踪 X 和 Y 增量（如scrollLeftDelta and scrollTopDelta， 分别）。我还没有尝试过其他元素；将其作为读者的练习。这适用于当前版本的 Chrome 和 Firefox。它使用了获取总和的技巧document.documentElement.scrollTop and document.body.scrollTop处理Chrome更新的bugbody.scrollTop代替documentElement.scrollTop（IE和FF更新documentElement.scrollTop; see https://code.google.com/p/chromium/issues/detail?id=2891 https://code.google.com/p/chromium/issues/detail?id=2891).
JSFiddle 演示：http://jsfiddle.net/tew9zxc1/ http://jsfiddle.net/tew9zxc1/
可运行的片段（向下滚动并单击Run code snippet):
// custom 'scrolldelta' event extends 'scroll' event
jQuery.event.special.scrolldelta = {
delegateType: "scroll",
bindType: "scroll",
handle: function (event) {
var handleObj = event.handleObj;
var targetData = jQuery.data(event.target);
var ret = null;
var elem = event.target;
var isDoc = elem === document;
var oldTop = targetData.top || 0;
var oldLeft = targetData.left || 0;
targetData.top = isDoc ? elem.documentElement.scrollTop + elem.body.scrollTop : elem.scrollTop;
targetData.left = isDoc ? elem.documentElement.scrollLeft + elem.body.scrollLeft : elem.scrollLeft;
event.scrollTopDelta = targetData.top - oldTop;
event.scrollTop = targetData.top;
event.scrollLeftDelta = targetData.left - oldLeft;
event.scrollLeft = targetData.left;
event.type = handleObj.origType;
ret = handleObj.handler.apply(this, arguments);
event.type = handleObj.type;
return ret;
}
};
// bind to custom 'scrolldelta' event
$(window).on('scrolldelta', function (e) {
var top = e.scrollTop;
var topDelta = e.scrollTopDelta;
var left = e.scrollLeft;
var leftDelta = e.scrollLeftDelta;
// do stuff with the above info; for now just display it to user
var feedbackText = 'scrollTop: ' + top.toString() + 'px (' + (topDelta >= 0 ? '+' : '') + topDelta.toString() + 'px), scrollLeft: ' + left.toString() + 'px (' + (leftDelta >= 0 ? '+' : '') + leftDelta.toString() + 'px)';
document.getElementById('feedback').innerHTML = feedbackText;
});
#content {
/* make window tall enough for vertical scroll */
height: 2000px;
/* make window wide enough for horizontal scroll */
width: 2000px;
/* visualization of scrollable content */
background-color: blue;
}
#feedback {
border:2px solid red;
padding: 4px;
color: black;
position: fixed;
top: 0;
height: 20px;
background-color: #fff;
font-family:'Segoe UI', 'Arial';
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='feedback'>scrollTop: 0px, scrollLeft: 0px</div>
<div id='content'></div>
请注意，您可能希望根据您正在执行的操作对事件进行反跳。您没有在问题中提供太多背景信息，但如果您提供一个更好的示例来说明您实际使用此信息的用途，我们可以提供更好的答案。 （请显示更多您的代码，以及您如何使用“滚动值”）。
