Wow! You’ve completed this table of 9 different jQuery effects. Great job! To review, the methods that we learned were:

  • .hide()
  • .show()
  • .toggle()

These methods instantly hide or show elements on a web page.

  • .fadeOut()
  • .fadeIn()
  • .fadeToggle()

These methods make elements disappear or appear over a given period of time.

  • .slideUp()
  • .slideDown()
  • .slideToggle()

These methods make elements slide up or down into place over a given period of time.

Using these effects, you can make your web pages eye-catching and dynamic. And thanks to the magic of jQuery all of this can be done with very few lines of code!


Your table is complete. Congratulations! Now take some time to tweak it and make it your own.

  • Can you change your code so a button applies its effect to all 3 images?
  • Can you make every button apply its effect to only the first image?
  • What happens when you apply effects one after another? For example, what happens when you apply .slideUp(), then .hide(), then .slideDown() to an image?

Take this course for free

Mini Info Outline Icon
By signing up for Codecademy, you agree to Codecademy's Terms of Service & Privacy Policy.

Or sign up using:

Already have an account?