我在右侧边栏上有一个滚动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();
});
});
}