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!
Instructions
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.