Minimal Clean Toaster Plugin For jQuery - myMessage

File Size: 11.6 KB
Views Total: 1707
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Minimal Clean Toaster Plugin For jQuery - myMessage

myMessage is a lightweight and simple-to-use jQuery plugin that lets you display Android toast style notification/alert messages with icon support on the webpage. The toast messages can be placed anywhere on the webpage and come with 4 themes: default, success, alert and warning.

How to use it:

1. Add references to jQuery library and the myMessage plugin's files into the html page.

<link rel="stylesheet" href="jquery.my-message.min.css">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jquery.my-message.min.js"></script>

2. Create a new MyMessage object and we're ready to go.

var message = new MyMessage.message({
    // default parameters here
});

3. Create toast notificaitons as these:

message.add("Default Message");
message.add("Success Message", "success");
message.add("Warning Message", "warning");
message.add("Error Message", "error");

4. To config the toast notifications, just override the default plugin settings as shown below:

var message = new MyMessage.message({
    iconFontSize: "20px", 
    messageFontSize: "12px", 
    showTime: 3000,
    align: "center",
    positions: { 
      top: "10px",
      bottom: "10px",
      right: "10px",
      left: "10px"
    },
    message: "This is a message", 
    type: "normal", // success,error,warning
});

Change log:

2017-06-02


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