Lightweight Snackbar JavaScript Library – HotSnackbar

HotSnackbar is a pure JavaScript library for creating Material Design inspired snackbars that display at the bottom of the screen when triggered.

How to use it:

Load the stylesheet ‘hotsnackbar.css’ for the basic styles of the snackbars.

<link href="hotsnackbar.css" rel="stylesheet">

Load the JavaScript file ‘hotsnackbar.css’ at the end of the document so the pages load faster.

<script src="hotsnackbar.js"></script>

The basic JavaScript syntax.

<button onclick="hotsnackbar('hsdone', 'Something is Successfully Completed');">Something Done</button>
<button onclick="hotsnackbar('hswarning', 'Something is Wrong');">Warning</button>
<button onclick="hotsnackbar('hserror', 'It Didnt Happen');">Error</button>
<button onclick="hotsnackbar('hsheart', 'Product added to Wishlist');">Heart it</button>
<button onclick="hotsnackbar('hssad', 'I`m Sad');">i`m Sad</button>
<button onclick="hotsnackbar(false, 'i`m without any icon , love me');">no icon</button>