页面没有一直滚动到底

Page not scrolling all the way to the bottom

本文关键字：滚动 一直      更新时间：2023-09-26

我刚刚在页面中添加了以下代码：

<script>
$(window).on('load resize',function(){
   var maxHeight = -1;
   $('.specification-columns').each(function() {
    maxHeight = maxHeight > $(this).height() ? maxHeight : $(this).height();
   });
   $('#specification').each(function() {
    $(this).height(maxHeight+24);
   });
 });
</script>

这样我就可以得到三个div的高度，选择最高的一个，并将包装高度设置为这个高度。由于我输入了代码，页面不会一直滚动到底部，你可以一直拖动滚动条到底部，它工作得很好，但如果你用鼠标滚轮滚动，它会在大约2/3-3/4的地方停止。

这是页面：http://zimxtrial.ukbigbuy.com/#specification

我不认为鼠标滚轮滚动问题特别与这段代码有关。问题出在您正在使用的某个库上。

我可以建议您使用chrome dev工具和javascript控制台来调试代码（使用断点或console.log），但在任何情况下，上面的代码看起来都应该只是从3个div中选择最大高度，只要您的html标记是正确的，并且没有其他具有相同类/id的div。

顺便说一句，我建议你避免使用Javascript来调整div的大小，这是一个最好留给CSS的问题。这个代码会很快变得很快，特别是在市场上有大量设备/屏幕尺寸的情况下。所以像"maxHeight+24"这样的硬编码是一个陷阱，以后会加倍努力

编辑：

删除为外部div设置高度的代码。如果没有在div上设置高度，您的页面就可以正常工作，它无论如何都会占用最高div的高度。

经过仔细检查，您的滚轮问题似乎来自文档开头的javascript。也就是说，你初始化你的平滑滚动脚本，然后你这样做：

$(document).on("scroll", onScroll);

当你滚动时，这会调用onScroll方法，所以我认为你的问题可以缩小到该函数中发生的事情。调试。

p.s.也做一些跨浏览器测试，你的页面在最新版本的Chrome和Firefox中看起来与我所看到的大不相同。

相关文章：