Toast is used to create something like an alert box which is shown for a short time like a couple of seconds when something happens. Like when the user clicks on a button or submits a form and many other actions.
- .toast: It helps to create a toast
- .toast-header : It helps to create the toast header
- .toast-body : It helps to create toast body
Example: How To Create a Toast.
Note: It should be initialized with jQuery. Just select the specified element and call this toast method.
- .toast(“show”): It shows the toast
- .toast(“hide”): It hides the toast
- .toast(“dispose”): It disposes the toast
show.bs.toast : It happens when the toast is about to be shown.
shown.bs.toast : It happens when the toast is shown.
hide.bs.toast : It happens when the toast is about to be hidden.
hidden.bs.toast : It happens when the toast is fully hidden.
- Difference between bootstrap.css and bootstrap-theme.css
- Include Bootstrap in AngularJS using ng-bootstrap
- Difference between Bootstrap 4 and Bootstrap 5
- Difference Between Bootstrap 3 and Bootstrap 4
- What's new in Bootstrap v4.3 ?
- Bootstrap 4 | Forms
- Bootstrap 4 | Cards
- Bootstrap 4 | Carousel
- Bootstrap 4 | Collapse
- Bootstrap 4 | Dropdowns
- Bootstrap 4 | Flex
- Bootstrap 4 | Tables
- Bootstrap 4 | Colors
- Bootstrap 4 | Buttons
- Bootstrap 4 | Tooltip
- Bootstrap 4 | Navigation Bar
- Bootstrap 4 | Navs
- Bootstrap 4 | Badges
- Bootstrap 4 | Alerts
- Bootstrap 4 | Images
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.