Here we will try to move an image horizontally to a distant on the click of a button. It’s not much of a tricky code. Feel free to copy and paste the following code. Here we go!
First the stylesheet:
At last the HTML:
<input name="" type="button" value="Change" onclick="ani()" />
How does it work:
The HTML marksup a picture, and button clicking which the function ani() runs which is defined in the Script written above inside head. In function ani() it is instructed to get the element with id=”something”. In HTML part there is a division with that id so its been called by the script. Now the code is inserting a class called classname into the division which is defined above in the CSS with all the information about the animations. So as soon as the button is clicked the function ani() is called and it invokes a class with animation properties into the division where id=”something”.