@hugeinc/stickynav

A simple navigation bar that efficiently attaches / detaches to the top of the viewport upon scrolling

Stats

StarsIssuesVersionUpdatedCreatedSize
@hugeinc/stickynav
900.5.84 years ago5 years agoMinified + gzip package size for @hugeinc/stickynav in KB

Readme

Sticky Nav

A simple navigation bar that efficiently attaches / detaches to the top of the viewport upon scrolling

Introduction

...

Getting Started

Download the production version or the development version.

ES6

import { stickyElement, stickyNav } from '../src/stickynav.es6.js';

CommonJS

var stickyElement = require('../src/stickynav.es6.js').stickyElement;
var stickyNav = require('../src/stickynav.es6.js').stickyNav;

AMD

require(['stickyElement', 'stickyNav'], function(stickyElement, stickyNav){
    // ...
})

Browser

<script src="path/to/stickyNav.js"></script>
<script>
    new stickyNav({
        nav: '#sticky',
        boundedBy: 'main'
    });
</script>

Documentation

...

Support

  • IE8+
  • Safari / Chrome
  • Firefox
  • iOS
  • Android

Known Issues

Examples

Please see the test / demo directory

Release History

0.5

  • Complete rewrite of StickyNav into an ES6 class
  • updating docs to better reflect options

0.4

  • adding offset to allow stickiness that is not necessarily at the top of the viewport

0.3

  • Breaking change: updating bounded to boundedBy
  • Better treatment of bounding element

0.1

  • initial commit

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.