Simple Modal Window With Configurable Animations - jQuery PopUpBox

Just another jQuery based popup box plugin to create modal windows with configurable open/close animations.

Features:

• CSS less (CSS in JS).
• Rotate & Scale animations.
• Allows you to specify the direction in which the animation starts.
• Fullscreen mode.
• Easy to implement with a single JS call.

How to use it:

1. Download the library and include the JavaScript file jquery.popupmodalbox.js after jQuery.

<script src="/path/to/latest/jquery.min.js"></script>
<script src="./jquery.popupmodalbox.js"></script>

2. Initialize the popup box plugin nd define the content (HTML content is supported) to be displayed in the modal.

$("body").popupbox({
  heading: "Modal Title",
  text: "<b>Modal Body</b>"
});

3. Customize the appearance of the modal window.

$("body").popupbox({
  heading: "Modal Title",
  text: "<b>Modal Body</b>",
  bgColor: "darkgrey",
  color: "White",
  boxShadow: "0px 0px 10px black",
  fullScreen: false
});

5. Config the animations as per your needs.

• direction: "frombottom", "fromtop", "fromright", "fromleft"
• animation: "scale", "rotate"

$("body").popupbox({
  heading: "Modal Title",
  text: "<b>Modal Body</b>",
  direction: "frombottom",
  startanimation: "rotate",
  duration: 0.5,
  endanimation: "scale"
});

---

This awesome jQuery plugin is developed by ibraveboy. For more Advanced Usages, please check the demo page or visit the official website.