0

我在右侧边栏上有一个滚动 div。它保持在另一个静态 div 之下。当我上下滚动时它工作正常,它始终保持在静态 div 下方。但是当我使用 ajax 向页面加载更多数据时,然后我将页面滚动到顶部,这个滚动 div 将停留在静态 div 之上。谁能帮我解决这个问题?

编辑3:调用ajax后,我再次绑定滚动功能,它可以工作。问题解决了。

编辑 2:我发现了问题:调用 ajax 后,滚动页面时 $(document).scrollTop() 不会返回新值。我现在如何获取 scrollTop() 值?

编辑:这是我的滚动 div 处理代码:

var init_pos_y = null;
var right_column_height = null;
var margin_top = 20;
var top_position = null;
var left_position = null;
var position_type = null;
var AdsHeight = $('#ads_follow').height();
function absoluteBottomPositionWindow()
{
    return $(document).scrollTop() + windowHeight();
}
function absoluteTopPositionWindow()
{
    return $(document).scrollTop();
}
function absoluteTopPositionAds()
{
    if (top_position != null && position_type != null && position_type != 'fixed')
        return top_position;
    else
    {
        offset_ads = $('#ads_follow').offset();
        return offset_ads.top - margin_top;
    }
}
function absoluteBottomPositionAds()
{
    if (top_position != null && position_type != null && position_type != 'fixed')
        return top_position + $('#ads_follow').height();
    else
    {
        offset_ads = $('#ads_follow').offset();
        return offset_ads.top + $('#ads_follow').height();
    }
}
function absoluteLeftPositionRightContainer()
{
    offset_ads = $('#right-boxes').offset();
    return offset_ads.left;
}
function absoluteBottomPositionRightContainer()
{
    offset_right_column = $('#right-boxes').offset();
    return offset_right_column.top + $('#right-boxes').height() + 30;
}
function windowHeight()
{
    return $(window).height();
}
function absoluteBottomPositionContent()
{
    offset_left_column = $('#left-column-content').offset();
    return offset_left_column.top + $('#left-column-content').height() + 30;
}
$(window).resize(function()
{
    if ($('#ads_follow').css('position') == 'absolute' || $('#ads_follow').css('position') == 'fixed')
        $('#ads_follow').css('left', absoluteLeftPositionRightContainer() + 'px');
});
$(window).scroll(function()
{
    if (right_column_height == null)
    {
        right_column_height = (absoluteBottomPositionRightContainer());
    }
    if (right_column_height < absoluteBottomPositionContent())
    {
        if (init_pos_y == null)
        {
            init_pos_y = absoluteTopPositionAds();
        }
        if (absoluteTopPositionWindow() <= init_pos_y)
        {
            position_type = 'static';
        }
        else if (absoluteTopPositionWindow() >= absoluteTopPositionAds() && position_type != 'fixed' && position_type != 'absolute')
        {
            top_position = margin_top;
            left_position = absoluteLeftPositionRightContainer();
            position_type = 'fixed'
        }
        if ((absoluteBottomPositionContent() - AdsHeight - margin_top) < absoluteTopPositionAds())
        {
            if ($('#ads_follow').css('position') != 'absolute')
            {
                top_position = absoluteBottomPositionContent() - AdsHeight;
                left_position = absoluteLeftPositionRightContainer();
                position_type = 'absolute';
            }
        }
        else if (absoluteTopPositionWindow() - margin_top < absoluteTopPositionAds() && position_type == 'absolute')
        {
            top_position = margin_top;
            left_position = absoluteLeftPositionRightContainer();
            position_type = 'fixed';
        }
        if (position_type != null)
            $('#ads_follow').css('position', position_type);
        if (left_position != null)
            $('#ads_follow').css('left', left_position + 'px');
        if (top_position != null)
            $('#ads_follow').css('top', top_position + 'px');
        left_position = null;
        top_position = null;
    }
});

这是我将更多数据加载到页面的代码

$(window).scroll(function() {
    scrollFunc();
});


function scrollFunc()
{
    if ($(window).scrollTop() == ($(document).height() - $(window).height())) {
        var offset = $('[id^="container-img-"]').length;
        $(window).unbind("scroll");

        if (offset < 15)
        {
            $("#seeMore").hide();
            $("#loadingPhoto").show();
            loadMoreRecords(offset);
        }
        else
        {
            $("#seeMore").show();
        }

    }

}


function loadMoreRecords(offset) {
    $.ajax({
        type: 'POST',
        url: getBaseURL() + 'ajax/loadMorePhoto',
        data: {
            offset: offset,
            currentpage: $("#currentPage").val()
        },
        success: function(data) {
            $("#loadingPhoto").hide();
            $("#listPhoto").html($("#listPhoto").html() + data);
        },
        error: function(data) {
            $("#loadingPhoto").hide();
            alert("Error loading photos");
        }

    }).done(function() {

        $(window).bind("scroll", function() {
            scrollFunc();

        });
    });

}
4

0 回答 0