How to make smooth movement of objects on a page?

There is a square which adds to its left + 10px. When clamping is moving with jerks, how to make a smooth move smooth?
Use vue.js perhaps he has some solutions? Or something of their own to offer.
June 5th 19 at 21:23
2 answers
June 5th 19 at 21:25
Solution
CSS transform and transition instead of a direct left - will be much smoother
June 5th 19 at 21:27
https://codepen.io/you_web/pen/PexjKd

The item will move to hang the property to transition: 0.5 s , 0.5 s where this time of transition

look again, I changed the time on 2s and it was very well smoothly. If that is not enough, you can play with this - htmlbook.ru/css/transition-timing-function
Not exactly. Even with the transition, when the clamp button, the position changes continuously, and still are jerks. And I need główna moving without jerks, such as in browser games - annabelle17 commented on June 5th 19 at 21:30
You do not understand.
When I clamped the key is a constant + 50px, that is, the animation work to the end no time, and still get the jerks. - annabelle17 commented on June 5th 19 at 21:33

Find more questions by tags HTMLCSSVue.js