All Posts by Email, Once a Week

Media Temple logo

CSS-Tricks is brought to you in part by Media Temple, the web hosting that we both use and recommend.

Help connecting dots

  • # December 24, 2012 at 1:43 pm

    I feel I am very close to getting my js to work.

    This is what i started with:
    $(‘article p, article .font-btns’).hide();
    var _this = this;
    $(‘article h1’).addClass(‘pointer’).click(function() {

    And i’m trying to implement the functionality of this here.
    var _this = this; // because this will point to a different object inside the callback
    $(this).siblings().slideToggle(‘slow’, function() {

    Much thanks.

    # December 24, 2012 at 1:55 pm

    Can you hook up a [Codepen]( please. And explain what you’re trying to achieve in a clearer fashion.

    # December 24, 2012 at 2:24 pm I am trying to get the background color and paragraph info to slidetoggle up all at once. Currently you can see the background color will dissapear and then the div will slide up. Instead of in sync.

    # December 24, 2012 at 3:18 pm

    This reply has been reported for inappropriate content.

    I don’t get it it looks fine to me and can you explain it in more detail

    # December 24, 2012 at 4:03 pm

    the current code – when the div is expanded and you click to close, the background disappears first and then the div will slide up to a close. Instead of a synchronous slide up with background and text. Apparently I can fix this issue with a callback. Just not sure how to do this.

    # December 24, 2012 at 5:51 pm

    I’m no jQuery guru, so I’m sure this could be cleaned up, but this should accomplish your goal:

    $(‘article h1’).addClass(‘pointer’).click(function() {
    var $article = $(this).parent(),
    $siblings = $(this).siblings();
    if ($article.hasClass(‘expanded’)) {
    $siblings.slideToggle().promise().done(function() {
    } else {

    # December 24, 2012 at 6:43 pm

    That it! Thank you @TreeRoot !

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed