Ng Bs Animated Button

screenshot of Ng Bs Animated Button

Angular/Bootstrap animated submit button directive

Overview

The ng-bs-animated-button is a fantastic directive for Angular and Bootstrap enthusiasts looking to enhance their applications with animated submit buttons. This directive not only streamlines the user experience but also adds a modern touch to web forms. With customizable options, developers can easily integrate it and provide feedback to users as actions are performed.

This tool is particularly beneficial for applications that prioritize user interaction, ensuring that users are visually informed about the status of their submissions. Whether you're indicating that a process is ongoing or showing that a task has been completed, this animated button brings clarity and engagement to your UI.

Features

  • Simple Installation: Easily integrate via Bower by including the necessary JavaScript and CSS files in your app.
  • Customizable Classes: Control the button's appearance with customizable classes for default, submitting, success, and error states.
  • Dynamic Text Options: Set different texts for button states such as "Submit", "Submitting...", "Completed" and error messages to keep users informed.
  • Visual Icons: Enhance user feedback with predefined icons for each button state, providing clear visual cues.
  • Animation Support: Offers a smooth transition between button states, with a default animation time of 2000ms for enhanced user experience.
  • Flexible Icon Positioning: Customize the alignment of icons relative to the button text, with options to display only icons or position them to the left.
  • Error Handling: Easily manage error states with a designated error class and message, ensuring users understand when issues arise.