1

我是一个真正的 js 菜鸟，所以问题如下所示。

我有浮动侧边栏，当它到达页脚时会停止浮动。js代码如下：

$(window).load(function(){
    $(function() {
        var top = $('#sidebar').offset().top - parseFloat($('#sidebar').css('marginTop').replace(/auto/, 0));
        var footTop = $('#footer').offset().top - parseFloat($('#footer').css('marginTop').replace(/auto/, 0));

        var maxY = footTop - $('#sidebar').outerHeight();

        $(window).scroll(function(evt) {
            var y = $(this).scrollTop();
            if (y > top) {
                if (y < maxY) {
                    $('#sidebar').addClass('fixed').removeAttr('style');
                } else {
                    $('#sidebar').removeClass('fixed').css({
                        position: 'absolute',
                        top: (maxY - top) + 'px'
                    });
                }
            } else {
                $('#sidebar').removeClass('fixed');
            }
        });

在我实现 ajax 分页和内容加载之前，这工作得很好。仅当我查看第一页时，侧边栏才会滚动，当通过 ajax 加载第二页时，侧边栏不会滚动。你可以在这里看到。

你有什么想法我需要在代码中更改以使其按我想要的方式工作吗？

4

2 回答 2

1

问题只是你初始化maxY了footTop一次。当您扩展文档时，它们需要更改。您可能会在每次滚动时重新计算它们。

于 2012-05-17T12:27:20.680 回答
0

这可能会帮助您找到所需的内容。

http://cubiq.org/dropbox/followalong/

于 2012-05-17T12:30:52.397 回答