This Section's Project

[MUSIC] 0:00 Welcome back. 0:04 Now that you have a basic understanding of jQuery plugins, 0:05 let's look at another plugin called StickyJS. 0:09 It lets you stick any page element to the top of a browser window. 0:12 It's great for a navigation bar that you want to remain visible when a visitor 0:16 scrolls down a page, or for keeping an important announcement ever-present. 0:20 Let's take a look at this plugin. 0:25 The StickyJS plugin is simple and useful. 0:27 When a user scrolls the page, 0:30 you can lock an element into place at the top of the browser window. 0:32 This is what we'll be adding to our project in this section of the course. 0:36 When I scroll down the page, this navigation bar will stick, and 0:39 stay in view. 0:43 Using CSS, you can even change the appearance of the fixed element. 0:44 A class is applied to the element when it's fixed, so you can create a style that 0:48 changes the look of the element when it's stuck to the top of the page. 0:52 You can even lock multiple elements into place. 0:56 Notice that on this page, the want us to work on your project paragraph 0:59 sticks just below the navigation bar. 1:03 You'll also notice that the content changes when it sticks. 1:06 A new Email us link appears when the paragraph sticks, but 1:09 disappears when you scroll back to the top of the page. 1:13 In this section of the course, I'll not only show you how to use this plugin, but 1:17 introduce plugin events, so that you can add programming that responds 1:21 to changes that the plugin makes to the page. 1:26 Let's get started. 1:29