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的高度，选择最高的div并将包装器高度设置为该值。由于我将代码放入，页面不会一直滚动到底部，您可以将滚动条一直拖动到底部，它可以正常工作但如果您使用鼠标滚轮滚动，它会停止大约2 / 3 - 3/4向下。

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

Answer 1

我认为鼠标滚轮滚动问题并不特别与此代码相关联。问题在于您正在使用的其中一个库。

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

顺便说一句，我建议你避免使用Javascript来调整div，这是一个最好留给CSS的问题。这个代码将很快变得毛茸茸，特别是市场上的设备/屏幕尺寸的镜像。因此，像“maxHeight + 24”这样的硬编码等等，是一个陷阱，将在以后加倍努力。

编辑：

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

仔细观察后，您的滚轮问题似乎来自文档头部的javascript位。即初始化smoothscroll脚本的位置，您可以这样做：

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

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

P.S。我也做了一些跨浏览器测试，在我看到的最新版本的Chrome和Firefox中，你的页面看起来截然不同。

页面不会一直滚动到底部

1 个答案: