Skip to content

Viral validation form where the submit button moves when the data is invalid.

Notifications You must be signed in to change notification settings

hassanmahfuj/Validation-Form-with-Moving-Submit-Button

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 

Repository files navigation

Viral Validation Form with Dynamic Submit Button

This project aims to create an engaging and interactive HTML form with CSS and JavaScript that dynamically moves the submit button when the user submits invalid data. This not only enhances user experience but also encourages users to correct their input. The project utilizes HTML for form structure, CSS for styling, and JavaScript for dynamic behavior.

Demo:

A live demo of the project can be found here.

Key Features:

  • Interactive Form: A user-friendly HTML form for data submission.
  • Dynamic Submit Button: The submit button's position is adjusted based on the validation result.
  • Validation Logic: JavaScript validates user input and dynamically responds to validation results.
  • Customizable Styling: The CSS is fully customizable to match your project's design.

How It Works:

  1. Form Structure: The HTML file defines the form structure with input fields and a submit button.
  2. CSS Styling: CSS is used to style the form and make it visually appealing.
  3. JavaScript Validation: JavaScript is responsible for validating user input. When the user submits invalid data, the submit button's position dynamically moves to provide feedback.
  4. Dynamic Animation: Depending on validation results, the submit button may move up or down and display a message indicating the reason for the invalid input.

Usage:

  1. Clone or download the project repository.
  2. Include the HTML, CSS, and JavaScript files in your web application.
  3. Customize the form fields and validation logic to match your requirements.
  4. Enjoy an engaging and user-friendly form submission process.

About

Viral validation form where the submit button moves when the data is invalid.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published