vanilla-material-notifications.js | Creating Material Design Style Notifications with JavaScript

vanilla-material-notifications.js is a javascript notification library, it can create material design style snackbars, toast messages, banner notifications for the web app.

vanilla-material-notifications.js - Creating Material Design Style Notifications with JavaScript

AuthorLinksMade withLast update
JacobTheEvansOffice HomeJavaScriptSep 15, 2022

How to create material design style notification using vanilla-material-notifications.js?

1.Import vanilla-material-notifications.js in your html page

<script src='./vanilla-material-notifications.js' />

2.Create material snackbars with different types:

snackbar({
  type: 'plain',
  position: 'bottomRight',
  message: 'Hello this is a plain message',
  timeout: 3000
})
snackbar({
  type: 'info',
  position: 'bottomLeft',
  message: 'Hello this is an info message',
  timeout: 3500
})
snackbar({
  type: 'warning',
  position: 'bottomLeft',
  message: 'Hello this is a very very long error message. With extra text',
  timeout: 2000
})
snackbar({
  type: 'alert',
  position: 'bottomLeft',
  message: 'Hello this is an alert message',
  timeout: 2000
})

Leave a Reply

Your email address will not be published. Required fields are marked *