amanagarwal041/toast

Library to create a toast message for a website

Toast

Toast is javascript based library for displaying a message or a notification on your website.

• javscript version : toast-js.js and toast-js.min.js
• jquery version : toast-jq.js and toast-jq.min.js

How to use ?

createToast is a function attached to the window.

createToast({ 
    message: 'This is your new toast', 
    autoHide: false, 
    closeButton: true 
});

---

Options to be passed to the functions :

Key	description
message	Message Text to be shown in the toast
toastClass	text - multiple classes separated by spaces
action	Object
action.actionText	text
action.actionClass	text - multiple classes separated by spaces
closeButton	Boolean : default true
closeClickEvent	function : default undefined
autoHide	Boolean : default true : true if closeButton is false
autoHideTime	integer : default 3000ms
unique	unique toast check : for this toastId parameter is must
toastId	string : for uniqueness of the toast

Tech

Toast uses number of open source projects :

• javascript - Accessing the html and appending data into dom!
• jQuery - Accessing the html and appending data into dom!
• Css - Providing awesome style to the toast elements.

And of course Toast itself is open source with a public repository on GitHub.

Installation

Toast requires jQuery any version preferably latest to run if toast-jq or toast-jq.min is used.

* Include the script file and css file into your html
* Change the css for the display container and the toast message box.

Special attention should be given to the z-index of the toast container if doesn't show up.

Toast is based on flex property of the css, so some browsers do not support flex yet. Change css as per your requirements.