检测页面是否具有垂直滚动条？

javascript jquery scroll

2022-08-30 04:28:07

我只想要一些简单的JQ / JS来检查当前页面/窗口（不是特定元素）是否具有垂直滚动条。

谷歌搜索给了我一些似乎过于复杂的东西，只是这个基本功能。

如何做到这一点？

答案 1

$(document).ready(function() {
    // Check if body height is higher than window height :)
    if ($("body").height() > $(window).height()) {
        alert("Vertical Scrollbar! D:");
    }

    // Check if body width is higher than window width :)
    if ($("body").width() > $(window).width()) {
        alert("Horizontal Scrollbar! D:<");
    }
});

答案 2

试试这个：

var hasVScroll = document.body.scrollHeight > document.body.clientHeight;

但是，这只会告诉您垂直滚动高度是否大于可视内容的高度。该变量将包含 true 或 false。hasVScroll

如果需要执行更彻底的检查，请将以下内容添加到上面的代码中：

// Get the computed style of the body element
var cStyle = document.body.currentStyle||window.getComputedStyle(document.body, "");

// Check the overflow and overflowY properties for "auto" and "visible" values
hasVScroll = cStyle.overflow == "visible" 
             || cStyle.overflowY == "visible"
             || (hasVScroll && cStyle.overflow == "auto")
             || (hasVScroll && cStyle.overflowY == "auto");