JS code is not working.

March 26th 2024 464 views • 2 comments
// Fist element
const fist = document.querySelector('fist');
// Man element
const man = document.querySelector('man');

// Define the initial size of the fist
const initialSize = 50;

// Define the Anime.js animation for the fist
anime({
  targets: '#fist',
  scale: [
    { value: initialSize, duration: 500, easing: 'easeOutQuad' }, // Fist enlarges
    { value: initialSize * 1.5, duration: 500, easing: 'easeInOutQuad' } // Fist returns to its original size
  ],
  translateX: [
    { value: '+=100', duration: 500, easing: 'easeOutQuad' }, // Move fist to the right
    { value: '-=100', duration: 500, easing: 'easeInOutQuad' } // Move fist back to its original position
  ],
  complete: function() {
    // Animation complete, make the man fall
    anime({
      targets: '#man',
      translateY: 100,
      rotateZ: '360deg',
      duration: 1000,
      easing: 'easeInOutQuad'
    });
  }
});

Can you please help me.It is anime.js . My animation is not working

Can you explain a bit more about the context? What do you wanna achieve with this code?

Your code has some issues that might be causing the animation not to work.

You should do it again.