Javascript 用户滚动时如何更改颜色

Javascript 用户滚动时如何更改颜色,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我有一段jQuery代码,当用户向下滚动时,它会更改一些颜色的元素。但是,当用户回滚页面时,我想切换到原始颜色。它不像我期望的那样工作 工作的原始代码 jQuery(window).scroll(function() { var scrollTop = jQuery(this).scrollTop(), offset = jQuery('#masthead').height() - 55; if ( scrollTop < offset ) jQ

我有一段jQuery代码,当用户向下滚动时,它会更改一些颜色的元素。但是,当用户回滚页面时,我想切换到原始颜色。它不像我期望的那样工作

工作的原始代码

jQuery(window).scroll(function() 
{
    var scrollTop = jQuery(this).scrollTop(),
    offset = jQuery('#masthead').height() - 55;
    if ( scrollTop < offset ) 
        jQuery(".float-manu").css({ backgroundColor: "rgba(0,0,0,0)" });
    else 
        jQuery(".float-manu").css({ backgroundColor: "rgba(0,0,0,0.7)" });
})
jQuery(窗口)。滚动(函数()
{
var scrollTop=jQuery(this).scrollTop(),
offset=jQuery(“#报头”).height()-55;
如果(滚动顶部<偏移量)
css({backgroundColor:“rgba(0,0,0,0)”});
其他的
css({backgroundColor:“rgba(0,0,0,0.7)”);
})
修改的代码也可以工作

})(window.jQuery);
jQuery(window).scroll(function() 
{
    var scrollTop = jQuery(this).scrollTop(),
    offset = jQuery('#masthead').height() - 55;
    if ( scrollTop < offset ) 
        jQuery(".float-manu").css({ backgroundColor: "rgba(0,0,0,0)" });
    else 
        jQuery(".float-manu").css({ backgroundColor: "rgba(0,0,0,0.7)" });
        jQuery(".primary-menu a").css({ color: "white" });
})
}(window.jQuery);
jQuery(窗口).滚动(函数()
{
var scrollTop=jQuery(this).scrollTop(),
offset=jQuery(“#报头”).height()-55;
如果(滚动顶部<偏移量)
css({backgroundColor:“rgba(0,0,0,0)”});
其他的
css({backgroundColor:“rgba(0,0,0,0.7)”);
jQuery(“.primary menu a”).css({color:“white”});
})
在第一个if语句中添加额外的css修饰符将终止脚本

})(window.jQuery);

jQuery(window).scroll(function() 
{
    var scrollTop = jQuery(this).scrollTop(),
    offset = jQuery('#masthead').height() - 55;
    if ( scrollTop < offset ) 
        jQuery(".float-manu").css({ backgroundColor: "rgba(0,0,0,0)" });
        jQuery(".primary-menu a").css({ color: "black" });
    else 
        jQuery(".float-manu").css({ backgroundColor: "rgba(0,0,0,0.7)" });
        jQuery(".primary-menu a").css({ color: "white" });
})
}(window.jQuery);
jQuery(窗口).滚动(函数()
{
var scrollTop=jQuery(this).scrollTop(),
offset=jQuery(“#报头”).height()-55;
如果(滚动顶部<偏移量)
css({backgroundColor:“rgba(0,0,0,0)”});
jQuery(“.primary menu a”).css({color:“black”});
其他的
css({backgroundColor:“rgba(0,0,0,0.7)”);
jQuery(“.primary menu a”).css({color:“white”});
})

我发现您的
if
else
中缺少括号。因此,只执行
if
else
后面的第一行。而是添加一个支架,如下所示:

 .....
 if ( scrollTop < offset ) {
      jQuery(".float-manu").css({ backgroundColor: "rgba(0,0,0,0)" });
      jQuery(".primary-menu a").css({ color: "black" });
 }
else {
     jQuery(".float-manu").css({ backgroundColor: "rgba(0,0,0,0.7)" });
     jQuery(".primary-menu a").css({ color: "white" });
 }
 ....
。。。。。
如果(滚动顶部<偏移量){
css({backgroundColor:“rgba(0,0,0,0)”});
jQuery(“.primary menu a”).css({color:“black”});
}
否则{
css({backgroundColor:“rgba(0,0,0,0.7)”);
jQuery(“.primary menu a”).css({color:“white”});
}
....

大括号!!!!你需要包装你的if语句的内容,否则它将在第一行之后被删除。你缺少if和elseLet me rain中的
{}
。。。我经常对一些可以作为结束一个问题的理由的东西的投票数量感到有点惊讶——这是一个基本的语法错误,对将来的参考价值很小。一个很好的建议可能是总是将代码通过验证器或查看错误控制台。谢谢,似乎很明显,但我想知道为什么他们在没有括号的情况下给了我。。。我觉得这很奇怪。@steve0nz因为如果在
if(…)
else(…)
后面只有一行,您就不需要它们了