In this tutorial you will learn how to make a simple animation using already available tools on our computer without the need of downloading extra huge and bulky tools which takes time to learn and slow downs our computer.
Step 1
Download 4 Files from https://www.vishalsharma.com.np/p/images-files.html and
Save the name as below: 1. bgImage.png
2. birdFly.gif
3. dogrun.gif
4. manrun.gif
Save the name as below: 1. bgImage.png
2. birdFly.gif
3. dogrun.gif
4. manrun.gif
Step 2
Open Notepad and Copy Paste below code, Save the Notepad file as index.html
--------------------------------------------------------------------------
<html>
<head><title>Animation</title></head>
<style>
body{
background-repeat: no-repeat;
background-size: 100% 100%;
background-attachment: fixed;
}
</style>
<body background = "bgImage.png">
<marquee direction="left" Scrolldelay="60" onmouseover="stop()" onmouseout="start()">
<img src="birdFly.gif" width= "20%" />
</marquee>
<marquee direction="right" Scrolldelay="60" onmouseover="stop()" onmouseout="start()">
<br><br><br><br><br><br><br><br><br>
<img src="dogrun.gif" width= "20%" />   
<img src="manrun.gif" width= "22%" /> 
</marquee>
</body>
</html>
--------------------------------------------------------------------------
Step 3
Open index.html using any Web Browser of your choice. Eg: Chrome, FireFox, Edge, Safari, etc.
0 comments:
Post a Comment