display hide multiple blocks

Question

The following part of my js displays and hides the an ul class called gallery_item_details_list which works just fine.

        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");
            });

My question is now, how can this code be modified to display / hide one more additional class called for example contact_block? I've tried to change the code to:

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

and

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

however this does not seem to work.

Some expert help would be truly appreciated.

nnnnnn · Accepted Answer · 2013-04-11 14:35:56Z

2

Use a comma between each selector:

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

Your original, working selector was:

".gallery_item_details_list .gallery_item_details"

which means select the .gallery_item_details elements that are descendants of .gallery_item_details_list elements. When you tried adding .contact_block to the end without a comma that mean find .contact_block elements that are descedants of .gallery_item_details elements that are descendants of .gallery_item_details_list elements.

answered Apr 11, 2013 at 14:35

nnnnnn

150k30 gold badges210 silver badges247 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

display hide multiple blocks

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related