Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Jquery expand Re: Jquery expand

#120635
chrisburton
Participant

First off, I just wanted to make it aware that I’m not that experienced in jQuery.

But I noticed something weird. When toggling the second h1, it doesn’t transition like the first. Not sure if this is a jQuery or CSS issue.

I also noticed that you’re hiding some classes but I don’t seem them being shown on the click function which leads me to believe that might be part of the problem. This is because when I comment out the first line, it almost does what it should.

$(‘article p, article .buy-btns’).hide();
$(‘article h1’).addClass(‘pointer’).click(function() {
var $article = $(this).closest(“.grid”),
$siblings = $(this).closest(“.grid”).find(“div.background:first”)
if ($article.hasClass(‘expanded’)) {
$siblings.slideToggle(‘slow’).promise().done(function() {
$article.removeClass(‘expanded’);
});
} else {
$article.addClass(‘expanded’);
$siblings.slideToggle(‘slow’);
}
});

Pen: http://codepen.io/chrisburton/pen/qJurK