当滚动到特定位置时，将div的位置设置为固定 - jQuery

Question

我正在处理一个包含三个垂直对齐的滑块的右侧边栏，希望在向下滚动到200像素时将边栏的位置固定。以下是我的代码：

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

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

- Daniel Harris

---

使用引号，"fixed"，fixed - Ram

添加了但是没有任何反应。 - Daniel Harris

Answer 1

好的，我想通了。我将$更改为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: ''});
        }
    }
});

- Daniel Harris

Answer 2

替换：

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

使用

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

字符串应该加引号！

- adeneo

---

什么也没发生。 - Daniel Harris

对我来说完全正常 -> FIDDLE，你是否记得使用document.ready，因为你正在使用jQuery获取DOM元素。 - adeneo

是的，我已经在代码中添加了document.ready函数，但它仍然没有任何作用。 - Daniel Harris

你确定当你滚动时 window.pageYOffset 在递增，并且有一个类为 col-right 的元素吗？ - adeneo

window.onscroll事件出现了一些问题，col-right类确实存在。 - Daniel Harris

你可以尝试使用jQuery版本 $(window).on('scroll', function() { ... });，但这很可疑。不知何故，滚动事件没有被触发。 - adeneo