Sticky-kit provides an easy way to attach elements to the page when the user scrolls such that the element is always visible.
Let's take a look at how we can use Sticky-Kit to make webpage elements remain persistent as the user scrolls past them.
While there are several similar jQuery scripts out there the nice thing about Sticky-Kit is that it automatically ensures that the sticky element becomes unstuck when its immediate parent is scrolled out of view, meaning we do not need to specify when the sticky behavior should stop.
Sticky Header
Sticky (Primary) Sidebar
Sticky Primary Navigation
Sticky Secondary Navigation
Sticky Genesis Simple Share on single Posts
Step 1
Upload jquery.sticky-kit.min.js to child theme's js directory.
Step 2
In this example I am going to assume that you do not want the sticky behavior on tablets and mobiles. As such, create a file named say, non-handhelds.js in child theme's js directory having the following code:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.
