Pure AngularJS component replicating Twitter Bootstrap's Scrollspy component behavior. The scrollspy behavior enables to automatically update nav targets based on scroll position.
-
Install with bower,
bower install angular-bootstrap-scrollspy --save
-
Or download the production version or the development version.
In your web page:
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-jquery/dist/angular-jquery.min.js"></script>
<script src="bower_components/angular-bootstrap-scrollspy/dist/angular-bootstrap-scrollspy.min.js"></script>
<script src="scripts/app.js"></script>
In your app.js:
angular.module('myApp', ['mgcrea.bootstrap.scrollspy'])
-
To easily add scrollspy behavior to any element, just add
bs-scrollspy
to the body element with adata-target
attribute of the element you want to spy on. -
Check Twitter Bootstrap's Scrollspy docs.
<body ng-controller="MainCtrl" bs-scrollspy data-target=".bs-docs-main" data-offset="auto">