# Affix affix.js

`mgcrea.ngStrap.affix`

## Examples

The subnavigation on the left is a live demo of the affix plugin.

#### Plugin dependency

Affix require the helpers.dimensions and helpers.debounce modules to be loaded.

            <div class="bs-sidebar hidden-print" role="complementary" data-offset-top="-80" bs-affix></div>

## Usage

Append a `bs-affix`attribute to any element to enable the plugin.

You can affix inside a custom container with the `bs-affix-target` attribute added to any parent element.

#### The module also exposes an `$affix`service

Available for programmatic use (mainly inside a directive as it requires an element).

              var affix = $affix(element, options);

### Options

Options can be passed via data-attributes on the directive or as an object hash to configure the service. For data attributes, append the option name to `data-`, as in `data-offset-top=""`.

Name | type | default | description
--- | --- | --- | ---
offsetTop | number | 0 | Pixels to offset from top of screen when calculating position of scroll.
offsetBottom | number | 0 | Pixels to offset from bottom of screen when calculating position of scroll.
offsetParent | number | HTML string | DOMElement |  | If provided, the affix will be positioned relative to a parent element. If a numeric value is present, the affix will try to find a parent that is N parents "up" in the DOM tree. If a non-numeric value is provided, the value is treated as an HTML string or DOMElement and constructed via angular.element(element).
offsetUnpin | number | 0 | Pixels to offset from unpin position when calculating position of scroll.

#### Default options

You can override global defaults for the plugin with `$affixProvider.defaults`

              angular.module('myApp')
              .config(function($affixProvider) {
                angular.extend($affixProvider.defaults, {
                  offsetTop: 100
                });
              })