jquery - jquery手风琴中的图像放大

Question

我正在尝试用 jquery 创建一个手风琴。现在我遇到了一个问题，那就是无法弄清楚如何放大单独幻灯片的图像。如果单击第一篇文章，它会起作用，但是当您单击下一篇文章时，第一篇文章的图像会保持放大尺寸。这是我的jQuery代码：

$(document).ready(function() {

        $(function () {
        $(".news").siblings("span").click(function () {
            $(".news").slideUp(200, function() {

                $(this).siblings(".news").toggle(500);

            });

            $(this).siblings(".news").toggle(500);
                $('#test').addClass('article').siblings('#headline').removeClass('article');

        });
    });



});

这是我的整个代码DEMO。希望有人可以帮助我。

Answer 1

有效 HTML 的主要规则之一，afaik 是不要对多个元素使用相同的 ID。（http://www.w3schools.com/tags/att_global_id.asp）

除此之外，使用正确的选择器很容易解决您的问题：

$('.foto').removeClass('article');
$(this).children('.foto').addClass('article');

见这里：http: //jsfiddle.net/rb7MK/4/