Image Modal

Image modal is a dialog box/popup window that is used to display an image at full size when the image thumbnail is clicked.

Simple Modal, without animation

Basic Image modal, without transition animations

Image Modal with Fading Animation using CSS Transitions

This version is using CSS transition efects, to add a fading effect on show and hide.

Image Modal with Fading and Growing Animation using CSS Transitions, when shown

In this version, the modal is displayed in such a way that it appears that the image is growing from initial postion and moving to fill the screen. Transition added only on show.

Image Modal with Fading In and Growing Animation and Fading Out and Shrinking Out using CSS Transitions

In this version, it has the similar effect when the modal is closed.