Hi, I am Haris back again with another verge 3d tutorial, in this tutorial you are going to learn how you can animation control slider with only verge 3d to control your animations.
For making things easy to understand for you I am dividing this tutorial into two parts.
1- Creating Interface
2- Puzzles
1- Creating Interface:
I am Creating this interface copy the HTML and CSS given below, paste it into your project HTML and CSS file.
HTML Code
CSS Code
2- PUZZLES:
Now create a variable that can store range slider values using “get prop” puzzle and important thing that you need to keep in mind is that your HTML input slider max value should be the same as the number of keyframes your animation has.
Now use the “set animation” puzzle and select your animation and add variable that store’s your range slider value next to the frame.
If you face any problem or need any help feel free to check my contact page
Source file
I am WebGL and verge 3d developer, i love to share my knowledge and experience with other people
