We Code Daily

jQuery: Effects (Part 2)

Objectives

slideDown()

The slideDown() effect, slides or brings the element down, as following:

$("#panel").slideDown("fast");

So we selected the divOne div and we made it slide down fast, you can also add a callback if you wanted it.

slideUp()

Pretty much the same as slideDown() :

$("#panel").slideUp("fast");

slideToggle()

If the element is hidden then it slideDown(), if the element is not hidden then slideUp().

$("#panel").slideToggle("fast");

So this was sliding, pretty easy huh? Now we will be doing some jQuery “chaining”.

Chaining

Do you remember the on() event? Chaining is a bit like it, chaining means to run multiple actions in one single statement AND it has to be on one element only. Chaining can give a short/small loop effect but it doesn’t actually loop.