Android Style Toaster Plugin with jQuery - Material Toast

File Size: 4.99 KB
Views Total: 822
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Android Style Toaster Plugin with jQuery - Material Toast

Material Toast is a super tiny jQuery plugin that shows Android style, customizable toast messages on the screen, inspired by the Google Material Design spec. By default, the toast messages shows with a CSS3 based fadeIn effect and automatically dismisses after 0.8 second.

How to use it:

1. Download the plugin, unzip it and link files to your html document. Make sure you also add the jQuery JavaScript library.

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

2. The JavaScript to show a basic toast message that appears at the bottom-left of the webpage.

Toast_Material({ content : "Simple Toast!"});

3. Place the toast anywhere you want.

Toast_Material({ 
  content : "Simple Toast!", 
  updown:"bottom", // top or bottom
  position:"center" // left, center or right
});

4. Setup the text alignment.

Toast_Material({ 
  content : "Simple Toast!", 
  align:"center" // left, center or right
});

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