仅当元素需要滚动时才添加类[重复]答案

【问题标题】：Add a class only if the element requires scroll [duplicate]仅当元素需要滚动时才添加类[重复]
【发布时间】：2016-09-12 06:13:02
【问题描述】：

我希望向元素添加一个类，但前提是内容需要用户滚动。

有问题的元素会响应屏幕尺寸，因此它只需要用户在较小的屏幕尺寸上滚动。我只想在这种情况下为元素添加不同的样式，而不是在内容适合而不滚动的情况下。

我不确定如何执行此操作，但我相信某处会有 js/jquery 解决方案！

【问题讨论】：

【解决方案1】：

这样的事情应该可以工作。基本上你检查元素的实际高度是否大于它的可见高度。

if($(element).innerHeight() < $(element)[0].scrollHeight) {
    $(element).addClass('scrollable-div');
}

【讨论】：

如果元素有填充，这将不起作用
这现在可以工作了，只是它与我的答案完全相同：D
你的意思是？你比我早 10 秒回答，之后你也编辑了你的答案。另外，您对它的工作原理没有任何解释。您应该始终解释您的答案是如何工作的，以便为未来的读者和 OP 带来价值。
我并没有恶意，您确实解释得更好，我只是厚脸皮，无意冒犯！我赞成你不称我为 git :)
不用担心，你的答案也投了赞成票，只需编辑一些快速解释，OP 肯定会选择你的答案。

【解决方案2】：

对于给定的元素，假设 id 为“MyId”，您可以这样做：

if ( $('#MyId')[0].scrollHeight > $('#MyId').innerHeight() )
{
    $('#MyId').addClass('myClass');
}

解释：

这是元素内容的高度，包括由于溢出而不可见的内容。

这是元素内容的实际高度，包括顶部和底部填充，并考虑到水平溢出。

相对

相同，但不考虑水平溢出。

【讨论】：

【解决方案3】：

只需添加一个.scroll 函数，不滚动它就不起作用。

$(window).scroll(function() {    
    var scroll = $(window).scrollTop();
    if (scroll >= 0) {
        // do something
    }

});

【讨论】：