NOTY is a notification library that makes it easy to create alert - success - error - warning - information - confirmation messages as an alternative the standard alert dialog.

GitHub release Bower version npm version Packagist version devDependency Status npm Contributors

Need help for Documentation & Translation Details are here.
v2.* documentation is here.

Show & Hide Animations

Using with class names. (like animate.css)

new Noty({
    text: 'NOTY - a jquery notification library!',
    animation: {
        open: 'animated bounceInLeft', // Animate.css class names
        close: 'animated bounceOutLeft', // Animate.css class names
    }
}).show();


Other cool ways

Animating with bounce.js Animating with mo.js Animating with velocity.js

Example css animation;

.noty_effects_open {
  opacity: 0;
  transform: translate(50%);
  animation: noty_anim_in 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.noty_effects_close {
  animation: noty_anim_out 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

@keyframes noty_anim_in {
  100% {
    transform: translate(0);
    opacity: 1;
  }
}

@keyframes noty_anim_out {
  100% {
    transform: translate(50%);
    opacity: 0;
  }
}
JavaScript animations are deprecated.