Javascript 用户滚动时更改页边距顶部

我试图让div向上滚动的像素数与用户向下滚动页面的像素数相同。例如，在Google Chrome中，当使用鼠标滚轮时，它会以大约20px的间隔向下滚动。但当您使用手柄向下滚动时，滚动量会发生变化

以下是我目前的代码：

var scrollCtr = 50;
$(window).scroll(function(){
   scrollCtr = scrollCtr - 20;
   $('div.nexus-files').css('margin-top', scrollCtr + 'px');
});

这方面存在一些问题：

用户滚动的方式各不相同

如果向下滚动，它需要从页边距顶部减去，如果向上滚动，它需要添加到页边距顶部

以下是一个例子：

---

感谢您的帮助

您做得不对，应该使用

div.nexus-files上的
position:fixed

div.nexus-files{position: fixed; top: 0;}

但是无论如何，如果您仍然想知道如何处理scroll事件，最好访问文档的
scrollTop
，并将
页边距top
设置为相同的值

window.onscroll = function(event){
    var doc = document.documentElement, body = document.body;
    var top = (doc && doc.scrollTop  || body && body.scrollTop  || 0);
    document.getElementById('nexus-files_id').style.marginTop = top+'px';
}

我使用纯Javascript而不是jQuery，因为当浏览器需要在很短的时间内（滚动期间）计算内容时，开销可能是至关重要的。[通过存储对元素和文档的引用，可以更高效地完成此操作…但您知道..）

我使用基于id的选择器来获取特定元素，而不是基于类的

我再说一遍，这不是你应该做的事情，为什么不使用实际的滚动偏移作为参考或位置呢

// or whatever offset you need
var scrollOffset = document.body.scrollTop + 20;

// jQuery
var scrollOffset = $("body").scrollTop() + 20;

终于明白了

下面是我用来完成任务的代码

大部分代码都来自，我对其进行了修改，以适应我的个人情况

jQuery(window).load(function(){
initParallax();
});

// parallax init
function initParallax(){
var win = jQuery(window);
var wrapper = jQuery('#wrapper');
var bg1 = wrapper.find('.nexus-files');
var koeff = 0.55;
if (bg1.length) {
    function refreshPosition(){
        var scrolled = win.scrollTop();
        var maxOffsetY1 = 450;
        var offsetY1 = scrolled * koeff;
        var offsetY2 = scrolled * koeff - (maxOffsetY1 * koeff - offsetY1);
        if (offsetY1 <= maxOffsetY1 * koeff - offsetY1) {
            bg1.css("margin-top", +-offsetY1+"px");
            //alert(+-offsetY1+"px");
        }
    }
    refreshPosition();
    win.bind('resize scroll', refreshPosition);
}
}

jQuery（窗口）.load（函数（）{
初始视差（）；
});
//视差初始
函数initParallax（）{
var-win=jQuery（窗口）；
var wrapper=jQuery（'#wrapper'）；
var bg1=wrapper.find（'.nexus文件'）；
var koeff=0.55；
if（bg1.长度）{
函数刷新位置（）{
var scrolled=win.scrollTop（）；
var maxOffsetY1=450；
var offsetY1=滚动的*koeff；
var offsetY2=滚动的*koeff-（maxOffsetY1*koeff-offsetY1）；
如果（offsetY1 CSS怎么样，
位置：fixed
？这是干什么用的？下面是我想做的：看看我下面的答案-关于
位置：fixed
解决方案-学习如何使用firebug/Chrome开发工具-它可以帮你省去问这个问题的工作量，如果不是这个，你意识到你可以访问当前的scrollTo窗口的p或处理程序中的其他元素。您不需要从静态数字开始猜测。我正在尝试反转边距，使其朝相反的方向移动。以下是我正在尝试做的：方向无关紧要！当您使用
scrollTop
属性时，您可以在滚动后获得当前的滚动位置-无论它是上下静止的-你真的不应该使用javascript！看看你给出的参考css文件中的第89行：如果使用fixed，我将如何使它反转？
position:fixed；
随着滚动而不是相反的方向移动？我们中的一个不理解另一个-因为我不理解这一点你正试图用“相反的方向”进行操作-我将坚持你给出的参考-这把小提琴有一个例子，说明你应该如何使用
position:fixed