https://github.com/maxisam/angular-bootstrap-affix
Affix directive for AngularJS inspired by Twitter Bootstrap
https://github.com/maxisam/angular-bootstrap-affix
Last synced: 10 months ago
JSON representation
Affix directive for AngularJS inspired by Twitter Bootstrap
- Host: GitHub
- URL: https://github.com/maxisam/angular-bootstrap-affix
- Owner: maxisam
- Created: 2013-07-28T06:09:18.000Z (about 13 years ago)
- Default Branch: master
- Last Pushed: 2017-05-09T17:31:50.000Z (over 9 years ago)
- Last Synced: 2025-01-30T00:22:24.408Z (over 1 year ago)
- Language: JavaScript
- Size: 23.4 KB
- Stars: 28
- Watchers: 3
- Forks: 31
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
Awesome Lists containing this project
README
# bootstrap.affix
Pure AngularJS component replicating [Twitter Bootstrap's Affix](http://getbootstrap.com/javascript/#affix) component behavior.
The affix behavior enables dynamic pinning of a DOM element during page scrolling when specific conditions are met.
## Getting Started
+ Install with bower, `bower install angular-bootstrap-affix --save`
+ Or download the [production version][min] or the [development version][max].
[min]: https://raw.github.com/mgcrea/jquery-bootstrap-affix/master/dist/angular-bootstrap-affix.min.js
[max]: https://raw.github.com/mgcrea/jquery-bootstrap-affix/master/dist/angular-bootstrap-affix.js
In your web page:
```html
```
In your app.js:
```js
angular.module('myApp', ['mgcrea.bootstrap.affix'])
```
## Documentation
+ To easily add affix behavior to any element, just add `bs-affix` to the element you want to spy on. Then use offsets to define when to toggle the pinning of an element on and off.
+ Check [Twitter Bootstrap's Affix](http://getbootstrap.com/javascript/#affix) docs.
## Examples
```html
.affix-top {
top: 30px; // css to define
}
.affix-bottom {
bottom: 0; // css to define
}
```