@pnx-mixtape/sticky

Documentation and examples: Sticky

Installation

npm install @pnx-mixtape/sticky --save

How to use

CSS

• PostCSS workflow: @import '@pnx-mixtape/sticky';
• Native CSS: @import url('dist/sticky.css');
• Link tag: <link href="dist/sticky.css" rel="stylesheet" type="text/css">

Vanilla JS

This javascript is only needed if you want to track when an element becomes sticky, in order to change its styles.

• ES6 import: import Sticky from '@pnx-mixtape/sticky';
• Script tag: <script src="dist/sticky.js" type="text/javascript"></script>

HTML

<div data-sticky class="sticky">
  <h4>Element to be fixed</h4>
  <p>Body content.</p>
</div>