Minimal Non-blocking Toast Notifiction Plugin - jQuery Message Toaster

Message Toaster is a simple, lightweight jQuery plugin created for displaying unobtrusive, non-blocking, and highly customizable toast (temporary) notifications on the screen. By default, the toast notification appears at the Bottom Right of the webpage and will auto fade out after 5 seconds.

How to use it:

1. Import both jQuery JavaScript library and the jQuery Message Toaster plugin's JavaScript file toaster.js into the html file.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" 
        crossorigin="anonymous">
</script>
<script src="toaster.js"></script>

2. Create a new Message Toaster instance and specify the message to be displayed in the toast notification.

var toaster = new Toaster({
    text: "Hello World"
});

3. Display the toast notification on the screen.

toaster.publish();

4. To customize the appearance of your toast notifications just by overriding the following options:

var toaster = new Toaster({

    // text color
    color: "#FFF",

    // background color
    background: "#333",
    
    // width
    width: "290px",

    // height
    height: "40px",

    // padding
    padding: "5px",

    // border radius
    cornerRadius: "5px"
    
});

5. Re-position the toast notifications.

var toaster = new Toaster({

    verticalPosition: "bottom",
    horizontalPosition: "right"

});

Changelog:

v0.6.6 (2019-11-27)

• Performance and source enhancement

---

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