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

时间:2015-08-10 11:35:36

标签: javascript jquery css

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

<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是标头的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>

但仍然无效

感谢您的帮助

1 个答案:

答案 0 :(得分:0)

引用jQuery doc-things

  

大多数非数字属性无法使用基本jQuery功能进行动画处理。例如,宽度,高度或左侧可以设置动画但 背景颜色无法设置动画

所以,你无法使用vanilla jQuery为backgroundColor设置动画。

如果您安装了jQuery.Color插件,那么您的脚本应该可以正常运行。