Simple Android-like jQuery Toasts Plugin - Toast.js

File Size: 121 KB
Views Total: 803
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Simple Android-like jQuery Toasts Plugin - Toast.js

Toast.js is a jQuery & jQuery UI plugin which allows you to display toast messages in a small & customizable popup as seen on the Android platforms.

See also:

How to use it:

1. Include the latest version of jQuery library and jQuery UI in your document.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>

2. Make sure to include the jQuery toast.js script after jQuery library.

<script src="src/toast.min.js"></script>

3. Display a toast message using all default settings on page loaded.

<script>
$(document).ready(function() {
  toast("I'm a basic toast message!");
});
</script>

4. Custom toast delay.

toast("I'm a toast message!",{"delay": 1000});

5. Custom toast position.

toast("I'm a toast message!",{"toast-pos" : "top"});

6. Custom toast styles.

opt_args = {
    "background-color"  :   "#00F",
    "border"            :   "5px dashed #F00",
    "color"             :   "#0F0",
    "font-family"       :   "monospace",
    "font-size"         :   "30px"
};
toast("I'm a toast message.", opt_args);

Change log:

2014-10-08

  • Added Cheezy Toast

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