Question

我正在尝试制作JS代码以在滚动时将导航栏背景更改为透明，但是由于某些原因它无法正常工作，并且我已经尝试了控制台日志并且正在正常工作，所以您可以帮我找出问题所在吗？

<script type="text/javascript">
$(document).scroll(function(){
    if($(this).scrollTop() > 1)
    {   
        $(".navbar-fixed-top").css("background-color", "white !important");
        console.log("Done");
    } else if ($(this).scrollTop() <= 1) {
        $(".navbar-fixed-top").css("background-color", "transparent !important");
        console.log("Back");
    }
});
</script>

Answer 1

您的代码正确，但是您无法通过这种方式将CSS属性定义为!important，因此只需将其删除

$(".navbar-fixed-top").css('background-color', 'white');`

或使用

$(".navbar-fixed-top").style('background-color', 'white', 'important');`

查看此帖子How to apply !important using .css()?

注意：顺便说一下，尝试将$(".navbar-fixed-top")保存在某个地方以提高性能，并避免在每次滚动窗口时获取它

scrollTop由于某些原因未更改css属性

1 个答案: