显示隐藏多个块

时间:2013-04-11 14:31:41

标签: jquery

我的js的以下部分显示并隐藏了一个名为gallery_item_details_list的ul类,它可以正常工作。

        var detailsBlock = $(location.hash);
        $(".gallery_item_details_list .gallery_item_details").css("display", "none");
        detailsBlock.css("display", "block");
        var galleryItem = $("#gallery-item-" + location.hash.substr(17));
        detailsBlock.find(".prev").attr("href", (galleryItem.prevAll(":not('.isotope-hidden')").first().length ? galleryItem.prevAll(":not('.isotope-hidden')").first().find(".open_details").attr("href") : $(".gallery:not('.horizontal_carousel')").children(":not('.isotope-hidden')").last().find(".open_details").attr("href")));
        detailsBlock.find(".next").attr("href", (galleryItem.nextAll(":not('.isotope-hidden')").first().length ? galleryItem.nextAll(":not('.isotope-hidden')").first().find(".open_details").attr("href") : $(".gallery:not('.horizontal_carousel')").children(":not('.isotope-hidden')").first().find(".open_details").attr("href")));
        var visible=parseInt($(".gallery_item_details_list").css("height"))==0 ? false : true;
        var galleryItemDetailsOffset;
        if(!visible)
        {
            $(".gallery_item_details_list").css("display", "block").animate({height:detailsBlock.height()}, 500, 'easeOutQuint', function(){
                $(this).css("height", "100%");
                $(location.hash + " .image_carousel").trigger("updateSizesCustom");
            });

现在我的问题是,如何修改此代码以显示/隐藏另一个名为contact_block的附加类?我试图将代码更改为:

    $(".gallery_item_details_list .gallery_item_details .contact_block").css("display", "none");

    $(".gallery_item_details_list .contact_block").css("display", "block").animate({height:detailsBlock.height()}, 500, 'easeOutQuint', function(){

然而这似乎不起作用。

真正感谢一些专家的帮助。

1 个答案:

答案 0 :(得分:2)

在每个选择器之间使用逗号:

$(".gallery_item_details_list .gallery_item_details, .contact_block").hide();

你原来的工作选择器是:

".gallery_item_details_list .gallery_item_details"

表示选择.gallery_item_details.gallery_item_details_list元素后代的元素。当您尝试将.contact_block添加到结尾时,而不是一个逗号,这意味着找到.contact_block个元素,这些元素是.gallery_item_details元素的后代,.gallery_item_details_list的后代元件。