0

我的网站上有一个浮动侧边栏

www.rayshaft.com
而且我也有ajax分页,所以侧边栏应该是浮动的,直到它到达页面的页脚,但问题是它只适用于第一页,当第二页通过ajax加载时,侧边栏不浮动。有人建议我更改我的 js 代码,以便每次在 ajax 页面加载后我都需要再次调用滚动函数,或者我需要重新计算 maxY 和 footTop ech 时间滚动发生。我不知道任何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');
        }
    });
4

1 回答 1

0

使滚动条的函数成为一个独立的函数,然后在 ajax 脚本完成时调用它。

function ScrollBar()
{
$(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');
    }});
}
}

$(window).load(function(){
    ScrollBar();
});

现在一旦 ajax 分页完成,调用这个函数:ScrollBar() 来重新定位滚动条。

于 2012-05-18T07:21:31.127 回答