Question

I want to toggle objects using JQuery. I can just only show/hide objects and I want to show/hide them slowly rather than immediately.

Showing and Hiding of Objects in JQuery

$("#txtA").toggle(type == "A");

I don’t know how to add “.show(‘slow’)” on the above code. Please help me. Thanks.

Answer 1

The documentation says that there is no overload for .toggle that both takes a boolean and allows you to specify an easing parameter:

.toggle( [ duration ], [ callback ] )
.toggle( [ duration ], [ easing ], [ callback ] )
.toggle( showOrHide )

However, the documentation also says that:

$('#foo').toggle(showOrHide);

is equivalent to:

if ( showOrHide == true ) {
  $('#foo').show();
} else if ( showOrHide == false ) {
  $('#foo').hide();
}

So, use that fact:

if (type == "A") {
  $('#txtA').show('slow');
}
else {
  $('#txtA').hide('slow');
}

And, no, sorry, you can’t avoid writing it out like this.

^{It seems bizarre, anyway, to want to call a function named “toggle” but specify whether you’re going to show or hide.}