Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

88
Views
Web Animations API add one anime to many elements

it is possible made code bellow using only Web Animations API? I don't like use included library, so I try use Web Animations API, but I can't find how Can I created one animations which include few elements.

var tl = anime.timeline({
  easing: 'linear',
  loop: true
});

tl
.add({
  targets: '.button-scroll-icon',
  height: ["100%", "0%"],
  duration: 500
})
.add({
  targets: '.button-scroll-icon',
  opacity: [1, 0],
  duration: 10
})
.add({
  targets: '.button-scroll-icon',
  height: ["0%", "100%"],
  duration: 10
})
.add({
  targets: '.button-scroll-wheel',
  translateY: 15,
  opacity: [1, 0],
  duration: 500
}, '-=520')
.add({
  targets: '.button-scroll',
  translateY: 10,
  duration: 500
}, '-=520')
.add({
  targets: '.button-scroll-text',
  opacity: [1, 0.5],
  duration: 500
}, '-=520')
.add({
  targets: '.button-scroll',
  translateY: 0,
  duration: 500
})
.add({
  targets: '.button-scroll-icon',
  opacity: [0, 1],
  duration: 500
}, '-=500')
.add({
  targets: '.button-scroll-text',
  opacity: [0.5, 1],
  duration: 500
}, '-=500');
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!