Question

I need to hide a div and, with this code it works fine:

    var idObj = $(this).attr('key');
var valH = $(this).attr('hideval');
var valS = $(this).attr('showval');

if ($('div[name='+idObj+']').attr('isdisplay') == 'no') {
    $('div[name='+idObj+']').children().show("slow");
    $('div[name='+idObj+']').attr('isdisplay','yes');
    var divTitle = $('div[name='+idObj+']').children().first();
    var divArrow = $(this).children().first();
    //.attr('src',prefixImg+valH);

    //divTitle.show();
    //divArrow.show();
    $(this).children().first().attr('src',prefixImg+valH);
} else {

    var divTitle = $('div[name='+idObj+']').children().first();
    var divArrow = $('div[name='+idObj+']').children().last();
    //.attr('src',prefixImg+valS);

    $('div[name='+idObj+']').children().hide();
    $('div[name='+idObj+']').attr('isdisplay','no');

    divTitle.show();
    divArrow.show();
    $(this).children().first().attr('src',prefixImg+valS);
}

My div is hidden and the Title and arrows to reopen the div are shown. But if I try to use hide(“slow”) the divTitle and divArrow don’t appear when my div is closed. Same problem using hide(1000).

Is there a difference between hide with and without “slow” parameter?

thanks,
Andrea

Answer 1

$(element).hide() hides an element instantly, where $(element).hide('slow') will animate its disappearance (slowly).

It looks like (though I’m not sure) you want to do stuff after the animation is finished. In that case, do something like this:

var that = this;  // here to preserve scope for the block below
$('div[name='+idObj+']').children().hide('slow', function() {

    // This stuff happens after the hide animation is done.
    $('div[name='+idObj+']').attr('isdisplay','no');

    divTitle.show();
    divArrow.show();
    $(that).children().first().attr('src',prefixImg+valS);  // <= note "that" instead of "this"

});