在包含div和图像时打开/关闭

Question

我试图通过使用css,javascript添加/删除活动类来突出显示当前图像.

我将我的解决方案上传到jsfiddle,请看一下.真的想知道这有什么问题. http://jsfiddle.net/BEmXZ/39/

HTML

<div class="container-thumbs">
    <div><a><img src=".jpg" /></a></div>
    <div><a class="active"><img src=".jpg" /></a></div> 
    <div><a><img src=".jpg" /></a></div>
</div>

使用Javascript

var make_button_active = function() {
    //Get item siblings
    var siblings =($(this).siblings());
    //Remove active class on all buttons
    siblings.each(function (index) {
            $(this).removeClass('active');
        }
    );

    //Add the clicked button class
    $(this).addClass('active');
}   

$(document).ready(function() {
    $(".container-thumbs a").click(make_button_active);
});

CSS

.container-thumbs{
    width: 300px; height: 25; font-size: 18px;
}
.container-thumbs a{
    list-style: none; float: left; margin-right: 4px; padding: 5px;
}
.container-thumbs div a:hover, .container-thumbs div a.active {
    background-color: #f90;
}?

Answer 1

siblings不起作用,因为你的锚被包裹在div中.尝试:

var make_button_active = function() {
    $(".container-thumbs a").removeClass("active");
    $(this).addClass("active");
}

$(document).ready(function() {
    $(".container-thumbs a").click(make_button_active);
});?

演示.(一个新的小提琴,因为你没有发布你的)