Skip to content

This project will build a simple yet customizable toast notification component. Users will be able to trigger notifications with different messages, types (success, error, info), and durations. The notifications will appear as small, non-intrusive boxes that slide in and out of view with animations.

Notifications You must be signed in to change notification settings

KrishnaSaxena108/Toast-Notification

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

15 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Toast Notification with HTML,CSS and JavaScript

This project demonstrates the creation of basic toast notifications using HTML for structure, CSS for styling and JavaScript for functionality.

Features:

  • Simple toast appearance with customizable content.
  • JavaScript-driven animations for smooth display and disappearance.

How to Use:

  1. Clone or download the project.
  2. Open the index.html file in your web browser.
  3. Modify the HTML and CSS to customize the toast notification's appearance.
  4. Explore the JavaScript code (script.js) to understand the logic behind animations and behaviour.

Example Usage

The code currently displays a basic toast notification. You can trigger it or modify its content through JavaScript within the project.

Feel free to:

  • Experiment with different styles and animations.
  • Enhance functionality with additional features like toast types or dismissal options.

Thankyou

About

This project will build a simple yet customizable toast notification component. Users will be able to trigger notifications with different messages, types (success, error, info), and durations. The notifications will appear as small, non-intrusive boxes that slide in and out of view with animations.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •