ChatGPT Course Section 13 Generating HTML Animations
ChatGPT is a text-based generative AI tool that can do various tasks. In this course, you will learn how to write prompts, generate content, generate codes and utilise its powerful features.
In this video lesson, we will learn about Generating HTML Animations in ChatGPT.
You can access the entire ChatGPT Course in the following playlist:
https://dailymotion.com/rss/playlist/x8jx4a
In this video lesson, we will learn about Generating HTML Animations in ChatGPT.
You can access the entire ChatGPT Course in the following playlist:
https://dailymotion.com/rss/playlist/x8jx4a
Category
📚
LearningTranscript
00:00So, what you can also do in TedGPT is you can go ahead and create HTML animations.
00:12So to do that, I'm going to go around and say create a HTML animation of a ball bouncing
00:27around the screen.
00:31Make sure the, of a ball, or let's say for example, four balls bouncing around a screen.
00:41Make sure all of the balls are different in color right here, just like this.
00:50And I'm going to go around and press enter.
00:53So once I go around and do that, it says certainly below is a simple HTML example that
00:57uses CSS and JavaScript to create an animation of four differently colored balls bouncing
01:03around the screen right here.
01:05And it added in this information as you can see right here.
01:09So now I'm simply going to go around and copy up this code and bring it into an application
01:14like Notepad and then go around and save this out on my desktop right here.
01:19So let's just go around over here and I'm going to go around and say animation.html.
01:26Let's see.
01:27For example, right here.
01:28And it's saved out right here.
01:29Let me just go ahead and close this.
01:32And now I'm going to go around onto my desktop and drag this particular animation file right
01:39here.
01:40And over here, you can see that this is what it actually generated right here.
01:44So four different colored balls.
01:45There's green right here, there's red, blue, and yellow as you can see.
01:50And they're bouncing around the screen just like this.
01:52If I were to go around and do this right here, then it is not responsive as you can see right
01:57here.
01:58It's like this.
01:59But you can see that as I do full screen right here, you can see that it simply goes around
02:03and then utilizes that particular area.
02:06So let's just go around and close it and drag this out right here.
02:09And once I do that, now you can see that it covers this particular area right here, just
02:14like this.
02:15And this is how you can go around and create HTML animations using JackTPT.
02:22So hope you found this video useful.
02:24So be sure to comment on what you think about it.
02:27Be sure to hit the like button.
02:29And don't forget to share this out with your friends and family.
02:32And for more contents like these, do follow Simple Tutorials.