https://github.com/wzr1337/angular-momentum-scroll

Momentum scroll for AngularJS based on iScroll
https://github.com/wzr1337/angular-momentum-scroll

Last synced: about 1 month ago
JSON representation

Momentum scroll for AngularJS based on iScroll

• Host: GitHub
• URL: https://github.com/wzr1337/angular-momentum-scroll
• Owner: wzr1337
• License: mit
• Created: 2013-04-16T18:57:12.000Z (over 11 years ago)
• Default Branch: master
• Last Pushed: 2016-03-20T12:34:39.000Z (almost 9 years ago)
• Last Synced: 2023-05-07T09:51:02.591Z (over 1 year ago)
• Language: JavaScript
• Size: 5.37 MB
• Stars: 65
• Watchers: 5
• Forks: 16
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: changelog.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        
# angular-momentum-scroll

AngularJS directive that adds momentum scroll via iScroll (http://cubiq.org).

## Demo

Find a demonstration on http://wzr1337.github.com

## Usage

* Include `scrollable.js` or `scrollable.min.js` into your page

* Declare `'angular-momentum-scroll'` as a dependency for your angular app: `angular.module('myApp', ['angular-momentum-scroll']);`

* Add the `scrollable` attribute to a container of your choice:

    * the container MUST have set width and height !!

    * in order to scroll horizontally the .scroller class inside of your container MUST have set width and height !!

* The container takes an additional attribute `parameters` according to iScroll docs. e.g. 

   

    ```javascript

    


* You can register any of the following handlers by specifying a callback function via attribute:

    * onRefresh

    * onBeforeScrollStart

    * onScrollStart

    * onBeforeScrollMove

    * onScrollMove

    * onBeforeScrollEnd

    * onScrollEnd

    * onTouchEnd

    * onDestroy

    * onZoomStart

    * onZoom

    * onZoomEnd

    ```javascript

    
...


* You can bind a variable to the curr-page-x and curr-page-y attribute. The data binding is bidirectional, so that you can scroll programatically as well as being notified on page change.

  ```javascript

    
...


* You can watch isMinY, isMinX and isMaxX, isMAxY to find out, if the scrlller reached its final top or bottom, left or right position. These help you to build an infinitescroll or similar. use them as follows:

  ```javascript

  


    
{{thing}}