如何在JQuery中找出浏览器窗口是否有可见的滚动条？

Question

我想知道是否有办法在JQuery中找出浏览器窗口是否有可见的滚动条？

这是我正在使用的代码：

var hContent = $("body").height(); 
var hWindow = $(window).height(); 

if(hContent>hWindow) {
    $('#scroll-top').fadeIn(250);    
}
else {
    $('#scroll-top').fadeOut(250);
}

任何帮助都得到了极大的赞赏，谢谢

Answer 1

使用以下功能。

function checkScrollBar() {
    var hContent = $("body").height(); // get the height of your content
    var hWindow = $(window).height();  // get the height of the visitor's browser window

    // if the height of your content is bigger than the height of the 
    // browser window, we have a scroll bar
    if(hContent>hWindow) { 
        return true;    
    }

    return false;
}

Answer 2

如果您将(window).height()与(document).height()进行比较会发生什么情况如果文档高度大于窗口高度，则滚动条应该可见但这也取决于您的CSS设置以及溢出是隐藏还是可见

修改

您需要创建一个侦听器，以便代码在正确的时间运行。这应该在调整浏览器窗口大小时起作用：

$(window).resize(function(){
    var hContent = $("body").height(); 
    var hWindow = $(window).height(); 

    if(hContent>hWindow) {
        $('#scroll-top').fadeIn(250);    
    }
    else {
        $('#scroll-top').fadeOut(250);
    }
}