jQuery animate function equivalent in pure JavaScript

后端 未结 3 1144
别那么骄傲
别那么骄傲 2020-12-29 05:35

What is the equivalent of the following jQuery animate in pure JavaScript?

3条回答
  •  一向
    一向 (楼主)
    2020-12-29 06:12

    This version uses vanilla javascript .animate() function, which is better or more performant
    than requestAnimation frame. & it is also the proper alternative to JQuerys .animate().
    you can play around with the iterations, timing functions & fill method aswell as daisy chain it with other animations

    document.getElementById("Elem");
             Elem.style.position = "absolute";
             Elem.animate({
                  top: ['8px', '280px']
                     },{ duration: 1760,        // number in ms [this would be equiv of your speed].
                         easing: 'ease-in-out',
                         iterations: 1,         // infinity or a number.
                      // fill: ''
            });   
    

    I believe the setTimeout & setInterval functions both use the unsafe eval() function under the hood, but not 100% sure about that, just remember reading an article about it...
    Don't Quote me on that! just research it,
    but the code I wrote out has been tested to be working.. hope this helps someone...

提交回复
热议问题