Question

我有一个div，其内嵌高度设置为浏览器窗口的100％高度：

element.style {
    height: 400px;
}
#scrollable-div {
    overflow-x: hidden;
    overflow-y: scroll;
    position: relative;
    width: 270px;
}

使用JS或jQuery，我想确定该div当前是否有滚动条，如果是，则隐藏/显示不同的div。有什么想法吗？

Answer 1

您可以使用此函数来了解元素是否具有滚动条：

$(document).ready(function() {
var mydiv = $('#scrollable-div');
console.log(mydiv1[0].scrollHeight);
console.log(mydiv1.height());
if (mydiv1[0].scrollHeight > mydiv1.height()) {
    console.log(1);
    //Has scrollbar
}
    else {
        console.log(2);
    //Dont has scrollbar
    }
});

Answer 2

我建议使用另一个包含内容的div，并且在scrollable-div范围内。这将有助于跟踪内容的高度，以便您执行逻辑。

if ($('#scrollable-inner').height() > $('#scrollable-div').height())
    $('#dependent-div').hide();
else
    $('#dependent-div').show();

查看完整代码＆amp;这个jsFiddle的演示。

如果div有滚动条，则使用Javascript隐藏/显示div

2 个答案: