Amazing Text Animation

2 years ago
14

In this JavaScript project you will learn how to create a amazing text animation using HTML CSS and JavaScript with delay.

🎱Source Code for this Video:
https://norbertbm.com/amazing-text-animation/
-----------------------------------------------------------------------------

👇 Website & Courses: 👨‍🏫 :
https://norbertbm.com/web-development/web-dev-courses/

Podcast:
https://www.youtube.com/channel/UCDKBcl1m__Oj7C5O-orhn_w
-------------------------------------------------------------------------------------------------
Timestamps:
00:00 - Intro & Project overview
00:30 - Create a index.html file
01:25 - Basic styling
04:28 - Create animation and add it to the title id
06:31 - Get title element from the DOM using querySelector
08:53 - Transform a string in to a array using js
10:12 - Wrap each item of the array in to a html div element
14:09 - Create and add a class to each item of the array
15:22 - Add the .anime-element in js
17:40 - Add Animation on mouse over event in js
18:06 - Add hover effect to the .anime-element class
18:53 - Add Animation on mouse over event in js
20:46 - Create a utility function to toggle the animation

-------------------------------------------------------------------------------------------------

-------------------------------------------------------------------------------------------------

#textanimation #javascript_project #norbertbmwebdevelopment

Loading comments...