如果offset.top大于视口高度，请更改背景

Question

我正试图使用此代码来检查#site_header的Y是否大于视口高度。考虑#site_header具有固定位置。我已经用.html（）打印了结果，它似乎工作正常，但在这段代码中似乎有一些错误。你能帮我吗？谢谢

jQuery(document).ready(function(){
   jQuery(window).load(function() {
    var viewportHeight = jQuery( window ).height();
    var site_header_offset = jQuery('#site_header').offset();
    var site_header_offset_top = jQuery(site_header_offset.top);
    if ( jQuery(site_header_offset_top >= viewportHeight) ) {
        jQuery('#site_header').css({'background-color':'rgba(0,0,0,0.35)'});
    }
    if ( jQuery(site_header_offset_top < viewportHeight) ) {
        jQuery('#site_header').css({'background-color':'rgba(0,0,0,0)'});
    }
   });
});

Answer 1

如果去掉第二行，它就可以工作了。（我已经反转了背景色）

http://jsfiddle.net/Lsct79rm/

jQuery(document).ready(function(){
var viewportHeight = jQuery( window ).height();
var site_header_offset = jQuery('#site_header').offset();
var site_header_offset_top = jQuery(site_header_offset.top);
if ( jQuery(site_header_offset_top >= viewportHeight) ) {
     jQuery('#site_header').css({'background-color':'rgba(0,0,0,0)'});
}
if ( jQuery(site_header_offset_top < viewportHeight) ) {
    jQuery('#site_header').css({'background-color':'rgba(0,0,0,0.35)'});
}
});

Answer 2

好的，我找到了解决方案。

        if ( jQuery(window).scrollTop() > viewportHeight ) {
            jQuery('#site_header').css({'background-color':'rgba(0,0,0,0.35)'});
        } else {
            jQuery('#site_header').css({'background-color':'rgba(0,0,0,0)'});
        }

我不明白我过去的代码出了什么问题，但这是有效的