0.3.0 • Published 2 years ago
@louis-internet/fixed-header v0.3.0
Fixed header
Simple script to toggle classes after scrolled some pixels. Perfect to for fixed headers.
Installation
Install from node
You can install fixed-header using the npm package manager with ...
npm install @louis-internet/fixed-headeror if you prefer Yarn with ...
yarn add @louis-internet/fixed-headerInclude Javascript files
<!-- From CDN -->
<script src="https://cdn.jsdelivr.net/npm/@louis-internet/fixed-header@X.X.X/dist/fixed-header.polyfilled.js"></script>
<!-- Downlaod from Github -->
<script src="dist/fixed-header.polyfilled.js"></script>Usage
To use the Library simply call it an give it as first param the selector
<body>
<header class="js-header">...</header>
</body>fixedHeader('.js-header', {
activeClass: 'toggle-class',
offset: 50,
})You can also set some options
Options
activeClass
Default: 'is-fixed' Type: String
offset
After this scroll offset the class whould be triggert
Default: 0 Type: Integer
related
Toggle classes on additional Dom Nodes
Default: [] Type: Array
fixedHeader('js-header', {
related: [
{
obj: 'html',
activeClass: 'header--is-fixed',
},
],
})