Small Unobtrusive Toast Popup Plugin For jQuery - simpleToast

File Size: 85.8 KB
Views Total: 1195
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Small Unobtrusive Toast Popup Plugin For jQuery - simpleToast

simpleToast is a small, unobtrusive yet customizable jQuery notification plugin to create minimal, clean, non-blocking toast popups on the web app.

How to use it:

1. Add references to jQuery library and the simpleToast plugin's file.

<link href="css/impleToast.css" rel="stylesheet">
<script src="" 
<script src="./js/simpleToast.js"></script>

2. Load a iconic font for the toast icons (OPTIONAL).

<link rel="stylesheet" href="">

3. Create and display a custom toast message on the screen.

  content: "Toast Message Here"

4. Override the default options to customize the toast message as per your needs.


  // toast message
  content: "Toast Message Here",

  // min width
  minWidth: "100px",

  // max width
  maxWidth: "200px",

  // CSS padding property
  padding: "10px 20px",

  // background color
  background: "#2b2a2a",

  // opacity level
  opacity: 0.9,

  // z-index
  zIndex: 9999, 

  // border radius
  borderRadius: "6px", 

  // duration in milliseconds
  duration: 2000, //toast 

  // animation
  animateIn: "boxBounceIn", 

  // duration of animation
  animateDuration: 500,

  // text color
  color: "#ffffff",

  // font size
  fontSize: "14px", 

  // toast icon

Change log:


  • rewritten in ES2015

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