Toastee toast style messages plugin example

Toastee is a super light-weight jQuery plugin (4kb) for creating simple toast-like messages.

Toastee comes with a few options built in, including:

• Toast Type: default (info), error, and success toasts.
• Custom toast heading.
• Custom toast message.
• Custom text color.
• Custom width and height.
• Custom fade-out timing.
• Mouse over a toast to keep it visible and the fade-out will restart when you mouse out.

To use Toastee, include jQuery and the toastee plugin on your page and then bind it to an element.

            
                
                /*  In your HTML  */

                
<div id="my-toast-location" style="position: fixed; top; 0; right: 20px;"></div>


                
                /*  In your JS file  */

                (function($){

                    $('#my-toast-location').toastee();

                })(jQuery);
            
            

Each toast type can have it's own set of options.
Check it!

                
                    (function($){

                    $('#my-toast-location').toaste({
                        type: 'success',
                        header: 'Toastee',
                        message: 'Got Butter?',
                        color: 'yellow',
                        background: '#FFBB00',
                        width: 100,
                        height: 200,
                        fadeout: 500
                    });
                    })(jQuery);