Javascript 未应用新高度的情况。我看不见

tl；博士 该问题是由顶栏上的5px填充引起的@谢谢你注意到这一点

这个问题是处理一个我从其他人那里创作的用户脚本

该脚本将用户列表从聊天中拉出来，并将其显示在页面顶部的一个漂亮的自动隐藏条中

完整的脚本很长，我不想污染页面-你可以看到它

我的问题是，在某些情况下，我无法计算出它们是什么，因为新顶杆的高度计算不正确

设置高度

还有剧本中真正的肉和土豆

    topbar.css({
        'position': 'fixed',
        'left': '0px',
        'z-index': '1',
        'width': '49%',
        'background-color': '#fff',
        'border-bottom': '2px solid #777',
        'box-shadow': '0px 5px 10px #777',
        'padding': '5px'
    });
topbar.append( $(document.getElementById('present-users')).detach() );
topbar.append( menu.detach() );
chat_body.append(topbar);
    setHeight();
    this.onresize = function() {
        if( !stuck ) {
            setHeight();
        }
    };
    this.onresize();

    topbar.hover(function() {
        if( !stuck ) {
            $(this).stop(true, true).animate({top:0}, 300, function() {
                checkHidden();
            });
        }

    }, function() {
        if( !stuck ) {
            $(this).stop(false, false).animate({top:_top}, 300);
            checkTop();
        }
    });

应该发生的是，topbar从侧边栏中提取适用的容器-计算其高度-然后在元素上设置正确的“top”css规则

我不能告诉你只复制图像的步骤。我认为只有当用户列表中有单个用户溢出时才会发生这种情况

应该看看

在某些情况下，这就是它的外观

脚本仍然打开和关闭，但具有“断开”的最大值。

所以一旦它被破坏了，mouseout会把它带回第二张图像

更新

我已经确认，只有当单个用户换行时才会发生这种情况- 复制步骤： 1安装脚本 2打开chat.se或chat.so聊天室 3为方便起见，将顶杆“粘住”打开 4调整浏览器窗口的大小，以便只有一个用户换行到新行 5松开顶杆 6刷新页面

解决方案：

.户外灯光

描述：获取匹配元素集中第一个元素的当前计算高度，包括填充、边框和可选边距。返回一个不带px表示的整数，如果对空元素集调用，则返回null

.身高

请注意，在现代浏览器中，CSS height属性不包括padding、border或margin

---

问题1：当高度不能正常工作时，您是否确实知道被卡住的cookie的值是多少？cookie只存储是否应用了粘性。是的，它被保留了。问题2：我已经查看了链接的JavaScript代码页，但是我还没有看到为topbar DIV设置最小高度的任何地方。这可以解决部分问题。我要解决的另一个跨浏览器兼容性问题是向动态创建的DIV添加topbar的类或ID。然后将CSS调整为.topbar类或topbar ID。现在不需要担心。最小高度也不是问题。。如果您阅读我的问题，并查看代码，您将看到setHeight函数的工作原理。。。在某些情况下，加载时无法获得正确的值。。。我真的认为只有当有一个额外的用户。。可能是盒子的问题？令人困惑的是，高度从未设定过。setHeight函数取决于当前用户列表的高度，但不进行设置。

    topbar.css({
        'position': 'fixed',
        'left': '0px',
        'z-index': '1',
        'width': '49%',
        'background-color': '#fff',
        'border-bottom': '2px solid #777',
        'box-shadow': '0px 5px 10px #777',
        'padding': '5px'
    });
topbar.append( $(document.getElementById('present-users')).detach() );
topbar.append( menu.detach() );
chat_body.append(topbar);
    setHeight();
    this.onresize = function() {
        if( !stuck ) {
            setHeight();
        }
    };
    this.onresize();

    topbar.hover(function() {
        if( !stuck ) {
            $(this).stop(true, true).animate({top:0}, 300, function() {
                checkHidden();
            });
        }

    }, function() {
        if( !stuck ) {
            $(this).stop(false, false).animate({top:_top}, 300);
            checkTop();
        }
    });

var setHeight = function() {
    _top = -(topbar.outerHeight() - 15);
    topbar.css('top', (stuck ? 0 : _top));
};