Skip to content
This repository has been archived by the owner on Apr 2, 2020. It is now read-only.

dotstudio-io/ng-scroll-glue

Repository files navigation


No longer maintained.


ng-scroll-glue Build Status

An AngularJS directive that automatically scrolls to the bottom of an element on changes in its scope.

##Important This is a fork of Lukas Wegmann's Angular Scroll Glue. I haven't touched the module's functionality, only the module's name.

If you're switching from Lukas' version you must change the directive name from luegg.directives to ngScrollGlue.

There's also a minified version available in the dist folder.

Install

Bower

$ bower install --save ng-scroll-glue

Usage

  1. Insert the script into your HTML:

    ...
    <script src="/components/ng-scroll-glue/dist/scrollglue.js"></script>
    ...

    Or the minified version for production:

    ...
    <script src="/components/ng-scroll-glue/dist/scrollglue.min.js"></script>
    ...
  2. Import the directive into your Angular app:

    /* Add `ngScrollGlue` to your module's dependencies */
    angular.module('App', [
    	//...
    	'ngScrollGlue'
    ]);
  3. Add the directive to your html:

    <div scroll-glue>
    	<!-- Content here will be "scroll-glued" -->
    </div>

The scroll-glueattribute glues the content to the bottom by default. You can set other directions with the attribute name, like scroll-glue-bottom, scroll-glue-top, scroll-glue-left or scroll-glue-right.

If you assign a variable name to the scroll-glue attribute that is present in the scope and it's true, it'll start glued to the glue direction defined in the attribute name:

// ...
$scope.glued = true;
// ...
<div scroll-glue="glued">
	<!-- Content here will start and will be "scroll-glued" -->
</div>

Example

Visit example page

About

An AngularJS directive that automatically scrolls to the bottom of an element on changes in it's scope

Resources

License

Stars

Watchers

Forks

Packages

No packages published