Static Modals

Nifty Modal Window Effects

There are many possibilities for modal overlays to appear. Here are some modern ways of showing them using CSS transitions and animations.Styles for the html/body for special modal where we want 3d effects Note that we need a container wrapping all content on the page for the perspective effects (not including the modals and the overlay).

Position

A positive % value in the top attribute will push the modal down the viewport. A positive % value on the right attribute will push the modal away from the right edge of the viewport, you can also use left and bottom values.The modal is by default positioned using fixed positioning, so it is fixed to the dimensions of the viewport.

Form Modal

Just keep your form code in between the <div class="modal-body> tags. & placed 2 lots of the code in the footer of this modal & change the Modal size, can target the Modal class.modal-dialog