AngularJS modal component
Simple, flexible and beautiful modal dialogs in AngularJS.
Demo
Installation
- If you use bower or npm, just
bower/npm install v-modal
. If not, download files from the github repo - Reference
v-modal.css
andv-modal.js
in your index.html file - Reference the module in your app:
angular.module('myApp', [ 'vModal' ])
Usage
app.js
angular ;
index.html
Show
my-modal.html
My modal OK
Configuration
Sizes
small
medium
large
fit
Positions
center
(default)middle
Container
To change the default container selector, use modalConfig
provider in your app config, like so:
angular ;
SCSS
If you are using SASS, you can import vModal.scss file and override the following variables:
;; ;;; ;; ;;; ;;; ;;
Accessibility
By default, vModal manages keyboard focus and adds some common ARIA attributes to improve accessibility of your dialogs.
Credits
vModal
service is based angular-modal by Brian Ford.