滚动到位置时将 div 位置设置为固定 - jQuery答案

【问题标题】：Set Div Position to Fixed When Scrolled to Position - jQuery滚动到位置时将 div 位置设置为固定 - jQuery
【发布时间】：2013-04-01 07:09:05
【问题描述】：

我正在使用包含三个垂直对齐的滑块的右侧边栏。当我向下滚动到 200 像素时，我希望固定侧边栏的位置。到目前为止，这是我的代码：

$(document).ready(function() {
    window.onscroll = function() {
        if (window.pageYOffset >= 200){
            $('.col-right').css({position: 'fixed', right: '490px'});
        }
    }
}

当我使用此代码时没有任何反应。它检测到我正在滚动，但它没有将 CSS 属性设置为侧边栏的“col-right”类。我这样做对吗？

【问题讨论】：

使用引号，"fixed"，fixed 是
已添加，但没有任何反应。

标签： jquery html scroll position css-position

【解决方案1】：

替换：

.css({position: fixed, right: 490px});

与

.css({position: 'fixed', right: '490px'});

字符串应该被引用！

【讨论】：

这样做了，没有任何反应。
对我来说很好用 -> FIDDLE，你还记得 document.ready，因为你正在使用 jQuery 获取 DOM 元素。
是的，我在代码中添加了 document.ready 函数，但它仍然什么都不做。
你确定window.pageYOffset在你滚动时会增加，并且你有一个类col-right的元素？
您总是可以查看 jQuery 版本是否有效 -> $(window).on('scroll', function() { ... });，但这是值得怀疑的。不知何故，滚动事件没有被触发。

【解决方案2】：

好的，我想通了。我将$ 更改为jQuery，一切正常。这是我的工作解决方案：

jQuery(document).ready(function(){
    window.onscroll = function() {
        if (window.pageYOffset >= 200){
            jQuery('.col-right').css({position: 'fixed', right: '490px', top: '40px'});
        }
        else {
            jQuery('.col-right').css({position: '', right: '', top: ''});
        }
    }
});

【讨论】：