Minimal Corner Notification Popup Plugin With jQuery - jsdvPopup

jsdvPopup is a super light jQuery plugin for showing a notification popup at the bottom right of the webpage to broadcast important messages about your website / web application.

Basic usage:

1. Add references to jQuery library and the jQuery jsdvPopup plugin to your html page.

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="src/jsdvPopup.js"></script>

2. Create custom text for the notification popup.

$.jsdvPopup({text:'Text here'});

3. Style the notification popup in the CSS

.popup {
  width: 300px;
  position: fixed;
  bottom: 10px;
  right: 10px;
  display: none;
  background: #f3f3f3;
  border-radius: 7px;
  box-shadow: 5px 5px 5px rgba(0,0,0,0.5);
  padding: 10px 35px 10px 10px;
}

.popup .close {
  position: absolute;
  top: 10px;
  right: 5px;
  width: 24px;
  height: 24px;
  cursor: pointer;
  background: url("images/icons/delete_24x24.png");
}

.popup img {
  float: left;
  margin-right: 10px;
}

.popup span {
  font-weight: bold;
  color: brown;
}

4. Add an image to your notification popup.

$.jsdvPopup({
  text:'Text here',
  icon: 'icon.png',
});

5. Change the amount of time to auto close the notification popup.

$.jsdvPopup({
  text:'Text here',
  icon: 'icon.png',
  timeout: 5000 // in ms
});

---

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