jquery - 尝试使用 jQuery .click 事件更改边框颜色

Question

我正在尝试使用 jQuery 的 .click 事件更改 5 div 的 class="Hoofdstuk"底部边框的颜色。正如您在以下链接中看到的:

casperjonker.site50.net

如您所见，它不起作用。 HTML 代码如下:

<div class="Hoofdstuk" id="Introductie"></div>
<div class="Hoofdstuk" id="Content"></div>
<div class="Hoofdstuk" id="Interactie"></div>
<div class="Hoofdstuk" id="FrontEnd"></div>
<div class="Hoofdstuk" id="Projecten"></div>

这是我的 jQuery 代码:

$('.Hoofdstuk').click(function () {
    $(this).animate({
        'width': '55em'
    }).siblings().animate({
        'width': '5em'
    }).css({
        'border-color': '#ffba00'
    }).siblings().css({
        'border-color': '#333'
    })
});

这是 CSS 代码:

.Hoofdstuk {
    width: 5em;
    height: 25em;
    float: left;
    border-width: 0.1em;
    overflow:hidden;
    border-bottom: #ffba00 solid 0.5em;
}

如果有人发现其中的问题，请告诉我。

感谢您抽出时间。

扬克

Answer 1

在你的第一个 .animate() 中 - 在继续之前使用 .end() 。这告诉它返回到原始选择器(this)，这可能是罪魁祸首。否则，它将使用siblings()作为当前选择器。