offsetHeight!== scrollHeight onResize,有时候

时间:2015-09-27 21:25:16

标签: javascript jquery javascript-events

我正在检查并将body.offsetHeight与body.scrollHeight进行比较。

向上扩展窗口大小会抛出相同的值,但缩小窗口有时会导致“跳跃”值,因此我会在Div上闪烁。 在Chrome 45 /和Firefox上测试。

var body = document.body,
    html = document.documentElement,
    offset,
    scroll;

$(window).resize(function() {
  offset = Math.max(body.offsetHeight, html.offsetHeight);
  scroll = Math.max(body.scrollHeight, html.scrollHeight);

  if (offset === scroll) {
    $(".myDiv").css("height", (offset - 155) + "px");
  } else {
    $(".myDiv").css("height", "");
  }
}).trigger("resize");

那么这里发生了什么? 有人可以向我解释一下,我做错了吗?

编辑: 说明我的问题的在线演示: http://jsfiddle.net/magic77/41bq62xs/

http://20thcenturyinterior.com/test/test.html

1 个答案:

答案 0 :(得分:1)

这看起来像一个简单的舍入问题。 offset向下舍入,scroll向上舍入,因此存在1的差异。你可以简单地解决这个问题:

if (Math.abs(offset - scroll) <= 1) {
    $(".myDiv").css("height", (offset - 155) + "px");
} else {
    $(".myDiv").css("height", "");
}

这是一种解决方法,正确的方法是在任何情况下都使用CSS。您可以针对您的具体问题提出另一个问题,标记为CSS。