Join Joe Marini for an in-depth discussion in this video Hiding and showing elements, part of jQuery Essential Training.
- View Offline
- Exercise Files
- Code Practice
- [Narrator] Let's start by taking a look…at one of the basic jQuery element effects,…which is the showing and hiding of elements.…So in your code editor open up the…showhide_start file which is in your chapter five.…So in my document ready function…I have written some placeholder functions…that I'm going to fill out as we go through the example.…These event handlers are triggered by…buttons which are down here in the page.…And this is the example element…that our code will operate on.…
The first two examples are going to demonstrate…the show function and the hide function…so let's go ahead and fill those in.…So in the show function I'll get…a reference to my div and call show.…And similarly I'll do the same thing,…well almost the same thing for the hide function.…So let's save and let's run what we have in the browser.…All right so when I click the hide and show buttons…you can see that the element is being shown and hidden…without any kind of animation,…and when it's hidden it's removed…from the browser's layout calculation…
- What is jQuery?
- Using selectors and filters to extract information
- Creating, inserting, and animating page content
- Handling events
- Understanding jQuery statement chaining
- Working with CSS
- Building event handlers
- Animating with jQuery: showing, hiding, and fading page elements
- Working with AJAX
Skill Level Beginner
1. A Quick Introduction to jQuery
2. Working with Page Content
3. Manipulating Page Content
4. jQuery Events
5. Animations and Effects
6. AJAX Operations
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.