Question

我正在尝试将div更改类设置为在到达页面顶部时修复。

我有 JavaScript 代码。

<script type="text/javascript">
    $(function () {

        var top = 200;
        var y = $(this).scrollTop();

        if (y >= top) {
            // if so, add the fixed class
            $('#kolonne-v').addClass('fixed');
        } else {
            // otherwise remove it
            $('#kolonne-v').removeClass('fixed');
        }
    });
</script>

我做错了什么？

Answer 1

Demo jsFiddle

<强> JS

$(function () {
    var top = 200; 
    //this should be the offset of the top of your div 
    //which can be found by doing the following line

    //var top = $("#kolonne-v").offset().top;

    $(window).on('scroll', function () {
        if (top <= $(window).scrollTop()) {
            // if so, add the fixed class
            $('#kolonne-v').addClass('fixed');
        } else {
            // otherwise remove it
            $('#kolonne-v').removeClass('fixed');
        }
    })
});

的描述 的

这使用jquery .on('scroll', handler)方法documentation here。基本原则是在document.ready上，当你的div固定在顶部时设置滚动点。然后设置一个.on('scroll', handler)事件，只要滚动窗口就触发该事件。如果用户滚动到您的位置，则添加fixed CSS类。

滚动时Div停在顶部

1 个答案:

Demo jsFiddle