Author: | ohno |
---|---|
Views Total: | 217 views |
Official Page: | Go to website |
Last Update: | October 22, 2021 |
License: | MIT |
Preview:

Description:
popup.js is a minimal notification popup library for creating toast-like alert messages on the page.
How to use it:
1. Include the necessary JavaScript and Stylesheet on the page.
<link rel="stylesheet" href="popup.css" /> <script src="popup.js"></script>
2. Create a basic toast popup.
popup("Hello World!");
3. Fetch the toast message from a given element.
<input id="input" value="Toast Message Here"> <button onClick='popup(document.getElementById("input").value);'>Click Me</button>
4. Override the default popup styles.
.popup { color: #FFFFFF; background: rgba(0,0,0,0.8); opacity: 1; padding: 20px; border-radius: 3px; white-space: nowrap; display: flex; align-items: center; justify-content: center; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); }