You could either set this to 'auto', which grabs your element's top margin, or to a custom pixel height. There is currently one additional option that stickUp offers, with more to come.Īdding this option to your stickUp element will catch the element by a margin. isStuck: This is only added to the sticky div WHILE it is actually stuck, and gets removed when un-stuck. stuckMenu: This is added to the sticky div when you first initialize the plugin. There are two classes that stickUp uses which you should be aware of. Please don't hesitate to make requests for features or settings that aren't natively available currently. I'm going to continue adding extra settings for this plugin. ItemHover: is the class which modifies the menu item to have a different appearence while it's corrosponding anchor is in view. ItemClass: is the class of each sticky navigation menu items. **The numbers above link the particular anchor ID with the menu item which it corresponds to in order. Next, modify your stickUp code from before to look like this: If these elements do not have an 'id=' attribute within the element please give them an ID and write it down. Simply follow these instructions in order to enable this functionality.įirst, make a list of the different elements within your page that you would like to have as ahcnor points. You have a 'one-pager' layout and would like for your sticky navbar to let the user know what they are currently viewing on the page. enabling stickUp on the '.navbar-wrapper' class Replace '.navbar-wrapper' with the class of the element you would like to become sticky. Alternitively, you could put the code into existing javascript. Next, simply insert this code at the end of your footer under the stickUp javascript file we added in the last step.

Make sure you're pointing to the correct location of the javascript file. Do so by inserting the following code at the end of your footer. Now include the stickUp javascript file to load within your website. If you need information about jQuery please click here. Make sure you also have jQuery available. Unpack it into an appropriate directory on your web sever. Download or Clone the stickUp javascript file from GitHub.

Stiyk