具有相同类名的多个div需要单独操作

Question

我目前正在尝试创建一种效果，当合适的链接悬停时，该效果将涉及面板扩展。当你将鼠标悬停在链接上使用jquery更改绝对位置以使其向上滑动但我有相同面板的重复项。我如何对此进行编码，以便在每个链接突出显示时，它仅激活其自己的面板的幻灯片，而不是所有共享相同div类的重复项。基本上需要将代码本地化为仅按每个面板运行，因为现在每个链接都会激活所有幻灯片

    $(function(){
        $(".expandLink").hover(function(){
            $(".hiddenContent").stop(true, false).animate({ top: "110px" }, 150);
        }, function() {
            $(".hiddenContent").stop(true, false).animate({ top: "185px" }, 150);
        });
    });

Answer 1

你必须选择find，如下所示：

$(function(){
    var allContent = $('.hiddentContent');
    var stopAnimation = function() {
        allContent.stop(true, false);
    };

    $(".expandLink").hover(function(){
        stopAnimation();

        $(this).find(".hiddenContent").animate({ top: "110px" }, 150);
    }, function() {
        stopAnimation();
        $(this).find(".hiddenContent").animate({ top: "185px" }, 150);
    });
});