jquery - 我如何使用 jquery 修改 Nivo Slider 中的控件导航？

Question

我正在尝试自定义 Nivo slider 。我已将这些样式添加到 Nivo slider 。这样，控件 nav 就变成了正方形。

.nivo-control {
    background-color:#eecd0d;
    height:19px;
    width:19px;
    margin-left:5px;
    float:left;
    text-indent:-9999px;
    text-decoration:none;
}

效果很好，所有数字看起来都像正方形。现在我要做的是让每个正方形(总是有四个)有不同的颜色。我所做的是创建 3 个不同的类(第一种颜色由 nivo-control 定义)。这是它的样子:

.second_li {
    background-color:#ab62bc;
}

.third_li {
    background-color:#c491d0;
}

.fourth_li {
    background-color:#d6b2de;
}

问题似乎出在 jQuery 代码上。我正在使用 addClass 将样式动态添加到控件，但它似乎不起作用。

$(function(){
    $(".nivo-controlNav a:nth-child(2)").addClass('second_li);
    $(".nivo-controlNav a:nth-child(3)").addClass('third_li);
    $(".nivo-controlNav a:nth-child(4)").addClass('fourth_li);
});

Answer 1

让我印象深刻的是 jQuery 代码块上的语法高亮显示。请注意第 3 行，在到达下一个引号之前，整行都是红色的。我认为您的代码很好，但是，您忘记在 .addClass() 参数之后添加结束涂层。你的代码应该是这样的

$(function(){
  $(".nivo-controlNav a:nth-child(2)").addClass('second_li');
  $(".nivo-controlNav a:nth-child(3)").addClass('third_li');
  $(".nivo-controlNav a:nth-child(4)").addClass('fourth_li');
});