Javascript Projects
Over 100+ Javascript examples / projects below
100+ Projects
HTML, CSS & Javascript
Below is over 100+ HTML, CSS, and JavaScript projects created in just a few weeks. These range from simple designs to more advanced features, showcasing the potential for building dynamic and modern website components.
Each project highlights a different aspect of web development, from responsive layouts and animations to functional elements that enhance user experience. This collection serves as a testament to the versatility and potential of these technologies in creating engaging and effective web solutions
What is Javascript? JavaScript, often abbreviated as JS, is a programming language and core technology of the Web, alongside HTML and CSS. 99% of websites use JavaScript on the client side for webpage behavior.
video background
Video Hero Background with Header and Button overlay.
PC & Mobile Ready
Click on image to view
animated loader
Example Animated Pre Loader. Easy UI Indicator for an End User
PC & Mobile Ready
Click on image to view
Animated cards
Simple Hover Effect on Cards. Card will Rotate and Scale on Hover
PC & Mobile Ready
Click on image to view
Hover effect
Hover Effect that will Scale And Slide Each Image Across
PC & Mobile Ready
Click on image to view
to do list
To Do List Where You can Store and Remove Tasks As Needed
PC & Mobile Ready
Click on image to view
Animated Navigation Bar
Animated Naviagtion Bar on Hover Effect with each tab
PC & Mobile Ready
Click on image to view
Animated Navigation Bar
Hover Effect that will Scale And Slide Each Image Across
PC & Mobile Ready
Click on image to view
image hover slider
Image Rollover Slider Example that Scales to a Text Overlay
PC & Mobile Ready
Click on image to view
Text Overlay Animation
Animated Slide Effect on Text Overlay. Effectice UI Example
PC & Mobile Ready
Click on image to view
Custom Scroll Bar
A Custom Scroll Bar within a HTML Page on a Desired Element
PC & Mobile Ready
Click on image to view
image as a Title
Using a Background Image as Title Text Header
PC & Mobile Ready
Click on image to view
Progress Scroll Bar
Animated Progress Bar on Page Scroll. Effectice UI Example
PC & Mobile Ready
Click on image to view
Animated Rollover Examples
Animated Custom Rolover on Card Elements for a HTML Page
PC & Mobile Ready
Click on image to view
animated heading
Animated Typing Header that Changes On Completetion
PC & Mobile Ready
Click on image to view
Background Colour Changer
Background Colour Changer with a Button Click
PC & Mobile Ready
Click on image to view
Mouse Cursor Pointer
Mouse Cursor Ponter that Maps with Yur Mouse Position
PC & Mobile Ready
Click on image to view
video pop up
Video Pop Up Example When Clicked a Video will Play
PC & Mobile Ready
Click on image to view
Dark / Light Switcher
Dark / Light Fade In & Out Transistion Example
PC & Mobile Ready
Click on image to view
Animated navigation bar
Animated Sliding Navigation Bar on Click Event
PC & Mobile Ready
Click on image to view
animated slider
Pop Slide Out / In Animated Banner on Mouse Click
PC & Mobile Ready
Click on image to view
Arrow Fade On Scroll
Arrow Fade Out / In on Scroll Down / Up Page Event
PC & Mobile Ready
Click on image to view
Simple Calculator
Simple Calculator with Add, Subtract, Divide & Multiply Functions
PC & Mobile Ready
Click on image to view
copy / paste selector
Copy And Paste Functionality from One Element to Another
PC & Mobile Ready
Click on image to view
Password Generator
Dynamic Password Genterator based on Symbols and Numvers
PC & Mobile Ready
Click on image to view
Blurry Load
Blurry Load on Image From 0% to 100% on Button Click
PC & Mobile Ready
Click on image to view
Tip calculator
Dynamic Tip Calculator that will Output the Result of a Tip
PC & Mobile Ready
Click on image to view
Rock, Paper Scissors Game
Rock, Paper Scissors Game with Dynamic Scorecard
PC & Mobile Ready
Click on image to view
Pop Up Form
Dynamic Pop Up Modal Sign Up Form on Button Click
PC & Mobile Ready
Click on image to view
Hide / Show Password
Dynamic Show / Hide Password Element on Button Click
PC & Mobile Ready
Click on image to view
Loading Progress Bar
Animated 0 to 100% Loading Bar on Page Load
PC & Mobile Ready
Click on image to view
Character Counter
Dynamic Character Counter Limiter to 50 Characters
PC & Mobile Ready
Click on image to view
Text Changer
Dynamic Text Changer Outout eg Bold, Italic, Uppercase etc..
PC & Mobile Ready
Click on image to view
Slideshow
Dynamic Slideshow on Arrow Clicks whit Fade in Transistions
PC & Mobile Ready
Click on image to view
pop up gallery
Dynamic Gallery with Modal Pop Up with Dark Overlay
PC & Mobile Ready
Click on image to view
Text reveal
Animated Full Text Reveal Slider on Button Click
PC & Mobile Ready
Click on image to view
Key Code Charcter
Dynamic Key Code Generator on Keyboard Press
PC & Mobile Ready
Click on image to view
Tab switcher
Dynamic Tab Button Switcher to Reveal Details of Tab
PC & Mobile Ready
Click on image to view
QR Code Generator
QR Code Generator that can be Downloaded and Used
PC & Mobile Ready
Click on image to view
Image Loader API
Dynamic Image Loader from Live Fetch API on Demand
PC & Mobile Ready
Click on image to view
Example Product Page
Dynamic Add To Cart Quantity Live Show on Website
PC & Mobile Ready
Click on image to view
Guess The Number Game
Guess the Number Game with Live Scoreboard
PC & Mobile Ready
Click on image to view
Digital Clock
Dynamic Digital Clock with Live Time (Hours, Minutes, Seconds)
PC & Mobile Ready
Click on image to view
Form Validation
Form Validation that Checks Passwords Validation and Email Format
PC & Mobile Ready
Click on image to view
Quizz Game
5 Question Quizz Game with Dynamic Score Chart
PC & Mobile Ready
Click on image to view
Logo Creator
Dynamic Text Logo Creator – Choose Font, Size and Colour
PC & Mobile Ready
Click on image to view
Colour Card Picker
Dynamic Colour Card Button with Backgroung Colour Changer
PC & Mobile Ready
Click on image to view
Simple Add To Cart
Dynamic Add To cart Example Shopping Page with Products
PC & Mobile Ready
Click on image to view
Date Countdown
Countdown Clock Using Date Picker With Changing Backgrounds each Month
PC & Mobile Ready
Click on image to view
BMI Calculator
BMI Calculator that Measures a BMI Calculation
PC & Mobile Ready
Click on image to view
Weather Location API
Location Weather API That OutPuts Local Weather at Input
PC & Mobile Ready
Click on image to view
Expense Tracker
Dynamic Live Expense Tracker with Local Storage
PC & Mobile Ready
Click on image to view
Receipe Filter
Receipe Filter with API with Live Search Fascility
PC & Mobile Ready
Click on image to view
Random Captcha
Dynamic Random Captcha Verification Component Checker
PC & Mobile Ready
Click on image to view
Testimonial Slider
Testiminals Slider Carousell with Button Controls
PC & Mobile Ready
Click on image to view
Nav Bar Colour Changer
Navigation Bar Colour Change on Scroll Down Page
PC & Mobile Ready
Click on image to view
Search and Hightlight
Dynamic Search And Highlight on Live Input Search
PC & Mobile Ready
Click on image to view
URL Shortener
URL Shortener – Reduces the Size of an URL for Easy Clicks
PC & Mobile Ready
Click on image to view
Heads or Tails
Heads or Tails Game With A Live Dynamic Scorecard
PC & Mobile Ready
Click on image to view
Location Finder
Dynamic Location Finder API Powered Throught Google API
PC & Mobile Ready
Click on image to view
Animatio Header
Animated Header on Page Load for Website Hero Section
PC & Mobile Ready
Click on image to view