页面没有一直滚动到底部

Question

我刚刚将此代码添加到我的页面：

<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

Answer 1

我不认为鼠标滚轮滚动问题与这段代码特别相关。问题在于您正在使用的库之一。

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

顺便说一句，我建议你避免使用 Javascript 来调整 div 的大小，这个问题最好留给 CSS。这段代码很快就会变得毛茸茸的，特别是在市场上各种设备/屏幕尺寸的情况下。所以硬编码诸如“maxHeight+24”之类的东西是一个陷阱，你以后会加倍努力。

---

编辑：

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

仔细检查后，您的滚轮问题似乎来自文档开头的 javascript 位。即在您初始化平滑滚动脚本的位置并执行以下操作：

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

这会在您滚动时调用 onScroll 方法，因此我假设您的问题可以缩小到该函数中发生的情况。调试。

附言也进行一些跨浏览器测试，您的页面在最新版本的 Chrome 和 Firefox 中看起来与我所看到的大不相同。