 |
| Notification Toast Stylish Library JavaScript |
Yet another toast JavaScript library to create toast-like temporary notification messages, which appear on the screen and then slide out after a short period of time.
One of the great features of the Saber Toast library is its support for RTL (Right To Left) languages. This means that you can use the library to create toast messages in languages such as Arabic or Hebrew, and the messages will be displayed correctly on the screen.
How to use it
1. Download and import the Saber Toast’s files.
<link rel="stylesheet" href="./saber-toast.css"> <script src="./saber-toast.js"></script>
2. Create toast messages using the saberToast.success and saberToast.error methods.
All available parameters:
- title: Title
- text: Toast message
- delay: Delay in ms
- duration: Duration in ms
- rtl: RTL mode
- position: "bottom-right", "bottom-left", "top-right", "top-left"
Bottom Right (Position)
saberToast.success({
title: "Success Message",
text: "This is a Success Toast",
delay: 200,
duration: 2600,
rtl: false,
position: "bottom-right"
})
Bottom Left (Position)
saberToast.success({
title: "Success Message",
text: "This is a Success Toast",
delay: 200,
duration: 2600,
rtl: false,
position: "top-left"
})
Top Left (Position)
saberToast.success({
title: "Success Message",
text: "This is a Success Toast",
delay: 200,
duration: 2600,
rtl: false,
position: "top-left"
})
Top Right (Position)
saberToast.error({
title: "Error Message",
text: "This is an Error Toast",
delay: 200,
duration: 2600,
rtl: true,
position: "top-right"
})
Live Demo
See the Pen Untitled by Plugin JS (@teguhsigit) on CodePen.
File Info
- File Name :
- saber-toast-main.zip
- Size :
- 4.35KB
- Site Download :
- Github.com
- Official Website:
- Go to website
- License:
- MIT