2016/01/17

ngVisibleInView - angular.js custom directive

Github

  • https://github.com/ktakeda47/ngVisibleInView

ngVisibleInView

This is an Angular.js custom directive which emit an event when an element is visible.
(This custom directive depends on jquery-visible.)

Installation

  • $ bower install ngVisibleInView

Usage

  1. Load jquery-visible : <script src="/bower_components/df-visible/jquery.visible.min.js"></script>
  2. Load ngVisibleInView : <script src="/bower_components/ngVisibleInView/ng-visible-in-view.js"></script>
  3. Inject ngVisibleInView to your angular app : angular.module("yourApp", ["ngVisibleInView"]);
  4. Add visible-in-view attribute to target element. : <div visible-in-view>hoge</div>
  5. Listen onVisibleInView event in parent scope :
    // When a target element is visible, this function receive onVisibleInView event.
    $scope.$on("onVisibleInView", function(event, args) {
     // do something...
    });
    

Detail

  • See sample directory.

Demo

0 件のコメント :

コメントを投稿