javascript - 页面向下滚动时更改标题颜色

Question

当我向下滚动页面时，我正在使用以下脚本，然后标题应该根据脚本更改颜色，但脚本不起作用我也在使用那个插件-:

<script type="text/javascript" src="https://raw.github.com/piouPiouM/jquery-color/master/jquery.color.js"></script> 

这是脚本:

         jQuery("#subheader").css("position", "fixed");
         jQuery(window).on("scroll",function () {
             jQuery("#subheader").stop().animate({
                 backgroundColor: jQuery(window).scrollTop() > 0 ? '#FFFFFF' : 'rgba(255,255,255,0.0)'
             }, 230);
         });    

#Subheader是header的div id 我也在用那个插件这是我的头标签-:

 <script src="http://code.jquery.com/color/jquery.color-2.1.2.js" type="text/javascript"></script>





     <script type="text/javascript" >
         jQuery("#subheader").css("position", "fixed");
        jQuery(window).scroll(function() {
            jQuery("#subheader").stop().animate({
              backgroundColor: jQuery(window).scrollTop() > 0 ? '#FFFFFF' : 'rgba(255,255,255,0.0)'
            }, 230);
        }); 
    </script>

还是不行

感谢帮助

Answer 1

引用jQuery doc-things :

most properties that are non-numeric cannot be animated using basic jQuery functionality. For example, width, height, or left can be animated but background-color cannot be animated

因此，您不能使用 vanilla jQuery 为 backgroundColor 设置动画。

如果安装 jQuery.Color插件，你的脚本应该可以工作。