ToastmeJS is a very simple, flexible, and lightweight plugin that displays notifications and media dialogs on your website.
javascript toast notification, toast overlay, javascript toast library, toastify js, css toast, toast message jquery, vanilla js toast
Features:
- Casual and light themes.
- custom icons.
- position variables.
- Custom lead time.
- Success/Error/Warning/Information types.
How to make use of it:
Install & import.
# NPM $ npm install toastjs --save
import toastme from 'toastjs'
Or straight load the next JS & CSS files within the doc.
<link rel="stylesheet" href="./dist/css/toastme.css"/> <script src="./dist/js/toastme.js" ></script>
Create a brand new toastme instance.
const myToast = new Toastme();
Create the toast notification.
myToast.default("This is a 'default' notification") myToast.success("This is a 'success' notification") myToast.error("This is an 'error' notification") myToast.warning("This is a 'warning' notification") myToast.info("This is an 'info' notification")
Config the toast notification by overriding the default parameters as follows:
const myToast = new Toastme({ timeout: 5000, distanceX: 15, distanceY: 15, positionY: "bottom", // or 'top' positionX:" right", // or 'left', 'center' zIndex: 100, ligh: false // light theme? });
Customizable!
You can customize duration, position, distance, z-overlapping and a theme
See Demo And Download
Official Website(AlexSegen): Click Here
This superior jQuery/javascript plugin is developed by AlexSegen. For extra Advanced Usages, please go to the official website.