That’s just a taste of what you can do with jQuery. While there’s still a lot to learn, in this unit you used jQuery to add dynamic behavior to a website. With jQuery objects, you can quickly target elements, handle events and add visual effects with just a few lines of code.

That said, when using any jQuery tools, it is important to consider how events and effects will appear on different platforms.

In this lesson, you learned:

  • About JavaScript libraries.
  • How to add jQuery to your web page.
  • How to avoid loading errors with the .ready() method.
  • About jQuery objects and their methods.
  • How to target elements by id and class.
  • Naming conventions for storing jQuery objects in JavaScript variables.
  • How to add event handlers with .on().
  • A couple jQuery effects, such as .hide() and .show().

Nice work!


In main.js, we added another .on() callback function, this time on the $navDropdown object.

We passed it 'mouseleave' with a callback function that hides the $navDropdown object. Before you run the code, read through it and predict the behavior this code causes in the web page.

When you’re ready, run the code.

Sign up to start coding

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?