https://github.com/izifortune/angular-sticky-element

A sticky element directive using jquery-waypoints
https://github.com/izifortune/angular-sticky-element

Last synced: 17 days ago
JSON representation

A sticky element directive using jquery-waypoints

• Host: GitHub
• URL: https://github.com/izifortune/angular-sticky-element
• Owner: izifortune
• License: mit
• Created: 2014-07-11T21:29:55.000Z (over 10 years ago)
• Default Branch: master
• Last Pushed: 2014-07-11T22:31:56.000Z (over 10 years ago)
• Last Synced: 2024-10-13T22:39:12.341Z (about 1 month ago)
• Language: JavaScript
• Homepage: http://izifortune.github.io/angular-sticky-element
• Size: 168 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
angular-sticky-element

======================

A sticky element directive using jquery-waypoints

Install it using bower

```

bower install angular-sticky-element

```

Then you need to include `sticky-element` in your application modules.

```

angular.module('myApp', ['stycky-element'])

```

You can use the directive this way

```





```


The directive will add the class `stuck` when the element will pass the scroll

and the direction is the one specified. Example of `.stuck` class:

```

.stuck {

    position: absolute;

    z-index: 90;

    top: 0;

    transition: 0.3s all;

}

```

You don't need to use position: fixed. Just make sure that the parent of the

element is `relative`.

Directive options are:

* `sticky-show`: for showing or hiding the element. You can't use ng-show

* `sticky-direction`: down || up || left || right

* `stickyOptions`:  all the options that you can pass to jquery-waypoints

More will come...