我有一个无限滚动的页面，当用户浏览器的缩放比例为 100% 时，该页面工作正常。如果用户在页面上放大或缩小(即不是 100%)，滚动最终会中断，页面将停止检索记录，即使还有更多要获取的记录。
我该如何纠正？
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title></title>
<script type="text/javascript" src="../../jquery/jquery-1.7.1.js"></script>
<script type="text/javascript">
$(window).scroll(function(){
if($(window).scrollTop() == $(document).height() - $(window).height()){
$('div#loadmoreajaxloader').show();
$.ajax({
url: "test2.php?lastid=" + $(".postitem:last").attr("id"),
success: function(html){
if(html){
$("#postswrapper").append(html);
$('div#loadmoreajaxloader').hide();
}else{
$('div#loadmoreajaxloader').html('<center>That\'s the Last One!</center>');
}
}
});
}
});
</script>
<style>
.postitem{
font-size: 16px;
padding: 5px 0 15px 0;
}
</style>
</head>
<body>
<div id="hycucdemosbody">
<div id="wrapper">
<div id="postswrapper">
<?php
for($counter=0; $counter <= 50; $counter += 1){
echo "\n".'<div class="postitem" id="'.$counter.'">Post no '.$counter.'</div>';
}
?>
</div>
<div id="loadmoreajaxloader" style="display:none;"><center><img src="ajax-loader.gif"/></center></div>
</div>
</div>
</body>
</html>
这是 test2.php:
<?php
if(isset($_GET['lastid'])){
$counter=addslashes($_GET['lastid']) + 1;
$total=$counter+25;
for($counter; $counter <= $total; $counter += 1){
echo "\n".'<div class="postitem" id="'.$counter.'">Post no '.$counter.'</div>';
}
}
?>
最佳答案
可能的解决方案
只是为了确定，
查看this link ，然后看看该解决方案是否对您有任何好处。它会检查您何时到达滚动条的底部。这真的很准确!
<div id="box" style="height:300px; overflow:auto;">
<div class="inner">
<!-- Your content goes here -->
</div>
</div>
var elem = $('#box');
var inner = $('#box > .inner');
if ( Math.abs(inner.offset().top) + elem.height() + elem.offset().top >= inner.outerHeight() ) {
// We're at the bottom!
}
检查缩放比例
嗯，如果还是不行，我建议你看看this question & answer .
他们讨论了如何检测不同浏览器中的缩放量。 您可以从那里更正您的代码以在确定滚动结束时考虑缩放。
无限滚动插件
除此之外，我建议您查看一些管理无限滚动的替代插件 喜欢
我可能会列出其他一些，但只进行 google 搜索会更容易，因为它们太多了。
编码愉快，好运! :)
关于jquery - 如果我缩放浏览器，无限滚动就会停止，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8670682/