An AngularJS directive implementing a Material Design floating action button menu with customizable effects and templates.
ng-material-floating-button is an AngularJS directive that implements a Material Design floating action button menu. It provides a customizable, interactive menu component that can be easily integrated into AngularJS applications, offering various visual effects and positioning options. The project solves the need for a standardized, aesthetically pleasing floating menu that follows Material Design principles without requiring extensive custom development.
AngularJS developers building web applications that follow Material Design guidelines and need interactive floating menus. It's particularly useful for those using or integrating with Angular Material who want consistent UI components.
Developers choose this directive because it offers a production-ready, customizable floating action button implementation specifically for AngularJS, with no external dependencies. Its seamless integration with Angular Material, multiple animation effects, and extensive customization options make it a versatile choice for adding interactive menus.
Material design floating menu with action buttons implemented as an Angularjs directive.
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Implements the floating action button pattern as per Google's Material Design, ensuring UI consistency with apps like Google Inbox and Evernote without custom design work.
Built as a native AngularJS directive, it integrates smoothly with AngularJS apps, supporting data-binding and dependency injection out-of-the-box with no external dependencies beyond Angular.
Offers multiple opening effects (e.g., zoomin, slidein), corner positioning, and template options, including pre-made templates for Angular Material, as detailed in the README's element attributes section.
Allows developers to programmatically open or close the menu via the menu-state attribute, enabling dynamic UI behaviors without user interaction, though it works best with click toggling.
The default CSS only supports up to 4 buttons; exceeding this requires custom SCSS compilation, adding development overhead as noted in the README's warning about button counts.
For hover toggling to work on touch devices, the directive necessitates Modernizr for detection, introducing an extra dependency that might not be present in all projects.
Exclusively designed for AngularJS 1.x, making it obsolete for projects on newer frameworks or Angular versions, with no migration path provided.