Modals Styles
Basic Modals (Nifty Modals)
Modal disables the original page beneath the overlay. The user needs to take an action or cancel the overlay until he can continue interacting with the original page. Modal are easy to implement, but they should be used sparingly. They interrupt the user flow, make it impossible to interact with the page and the overlay at the same time, and hide the content behind the overlay. This can be very annoying to users.
Position
There are four direction for the modal slider in from the page screen. when you click the button of each preivew image below, you will see the relevant modal demo.
Top
Center
Bottom
Sidebar
Form Modal
This modals including title, input for each field.
Multiple Modals
There is a new modal displayed overlay the first one by clicking the function button.
Optional Sizes
This modal has multiple size dialog for you to choice.
Tab In Modal
This modal including title, tabs for you display additional content inline in the same modal.
Accordions In Modal
This modal with accordions to have additional content hidden until the user needs them.
Grid In Modal
This modal including title and grids to layout through a series of two columns that house your content.
Styles
We provide six color options for modal title background color.
Choose color generate:
Fill In
This modal zooms from the middle and fills in fill-in to the modal.