js animation code example

Example 1: javascript animate elements

document.getElementById("tunnel").animate([
  // keyframes
  { transform: 'translateY(0px)' },
  { transform: 'translateY(-300px)' }
], {
  // timing options
  duration: 1000,
  iterations: Infinity
});

Example 2: js animation

You can learn js animation from here
https://www.w3schools.com/howto/howto_js_animate.asp

Example 3: js keyframe

$ . sleutelframe . define ( { 
    naam : 'ball-roll' , 
    van : { 
        'transform' : 'rotate (0deg)' 
    } , 
    naar : { 
        'transform' : 'rotate (360deg)' 
    } 
} ) ;

Example 4: js add animation to element

var animation = element.animate(keyframes, options);

Example 5: how to add animation over image in Javascript

function startAnimation() {
    var frameHeight = 102;
    var frames = 15;
    var frame = 0;
    var div = document.getElementById("animation");
    setInterval(function () {
        var frameOffset = (++frame % frames) * -frameHeight;
        div.style.backgroundPosition = "0px " + frameOffset + "px";
    }, 100);
}

Tags:

Misc Example