What's new
HTML Forums | An HTML and CSS Coding Community

Welcome to HTMLForums; home of web development discussion! Please sign in or register your free account to get involved. Once registered you will be able to connect with other members, send and receive private messages, reply to topics and create your very own. Our registration process is hassle-free and takes no time at all!

Problem with the animation of the button on the site


New member
The authorities have given to freelancers a few million rubles for the website (beta.sintez.io), and the button animation on the main page is ragged and jumpy, the bottom of one position of the button misses the beginning of the looping part. Since there are a lot of graphic elements and animations on the site, it was decided to make a preloader, after its loading the animation of all of the site elements should start smoothly, without twitching and loss of frames, especially the main button (PLAY button) in the center on the first screen. It has 3 positions - 1. appearance (24 frames), 2. main animation (48 frames), 3. induced position. The problem is that after loading the preloader, the "appearance" animation begins either not from the first frame, or the "main animation" begins without waiting for the "appearance" animation to finish, that is, two animations overlap, as a result, we get a "ragged animation", loss of frames and in general not really correct operation of this button.

Freelancers blame this problem on "too many graphic elements and animations", as well as the fact that existing web technologies and supercomputers are not able to smoothly reproduce the animation consisting of two small WEBP files. Is that true? If not, what is the error in the current version?