- angular.js
- ngAnimate 1.3.15
- Add 'PopMessenger' as a dependency in your module.
- Add the 'pop' service as a dependency in your controller.
Insert the tag into your HTML, configured as desired. To display a message, call 'pop(msg)'.
If you would like to change the styles of your messages dynamically the config attributes will evaluate whatever bindings you supply them.
The directive can be configured through the following attributes:
pos: position in the window where you want messages to display. Accepts:
- 'top-left'
- 'top-right'
- 'bottom-left'
- 'bottom-right'
Default: bottom-right
show: the time in ms you want messages to display
Default: 3000
anim: the style of enter/leave animation. Accepts:
- 'vslide': slide/fade in an out vertically
- 'fade': only fade in and out
Default: vslide
bg: the background color of the message box. Accepts CSS Color Names and rgb: rgb(100, 100, 100), lightblue.
Default: lightgray
txt-col: the color of the message text. Accepts the same parameters as bg.
Default: black
alpha: the opacity of the message box and message text. Accepts 0 through 1: 30% = 0.3, 100% = 1, 80% = 0.8
Default: 0.5