Question

当标题在滚动时调整大小时，我正在改变菜单文本的颜色。

我尝试了以下内容：

$(window).scroll(function() {
  if ($(document).scrollTop() > 20) {
    $('ul.art-hmenu>li>a').addClass('shrinkmenufont');
  } else {
    $('ul.art-hmenu>li>a').removeClass('shrinkmenufont');
  }
});

使用：

.shrinkmenufont {
  font-color: black;
}

我可以看到该功能正在执行，但当用户向下滚动时，字体的颜色不会从白色变为黑色

任何提示都将不胜感激

谢谢

链接：

Website

Answer 1

您只能在css下面添加调整大小标题字体颜色的更改：

CSS：

.shrinknav a.shrinkmenufont {
  color: #000;
}

Answer 2

你有两个问题。首先，用于设置文本颜色的CSS属性仅为color，而不是text-color。其次，将颜色设置为橙色的规则是ul.art-hmenu > li > a.active。这比.shrinkmenufont具有更高的特异性，因此优先于它。对于要使用的黑色，您需要使您的规则更具体，或者相同，但之后放置。试试这个：

ul.art-hmenu > li > a.shrinkmenufont {
    color: 'black';
}

Answer 3

$(window).scroll(function() {
   if ($(document).scrollTop() > 20) {
       $('ul.art-hmenu>li>a').css('color', 'black');
   } else {
       $('ul.art-hmenu>li>a').css('color', 'white');
   }
});

导航菜单缩小 - 字体颜色

3 个答案: