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

222
Views
¿Cómo alinear el retraso de la animación CSS con el retraso de NodeJS?

¿Cómo agrego un precargador cuando mi setTimeout está en NodeJS? A continuación se muestra el código para llamar a la API y establecer un retraso de 10 segundos:

 function delay(s){ return new Promise(resolve => setTimeout(resolve,s)); } async function getXml(){ let ans; await delay(10000) const {data} = await axios.get('https://gist.githubusercontent.com/SwayamShah97/a3619c5828ac8ed8085c4ae295a855d9/raw/e4e372552e042bd8bd9e8ab87da93eb030114f86/people.xml'); xml2js.parseString(data, (err, result) => { if(err) { throw err; } ans = result });

He intentado agregar el cargador usando frontend js así:

 window.addEventListener("load", function () { const loader = document.querySelector(".loader"); loader.className += " hidden"; // class "loader hidden" });

HTML:

 <div class="loader"> <img src="/public/images/coffee-loading.gif" alt="Loading..." /> </div>

CSS:

 .loader.hidden { animation: fadeOut 10s; animation-fill-mode: forwards; } @keyframes fadeOut { 100% { opacity: 0; visibility: hidden; } }

La forma en que funciona es que espera 10 s como debería debido a setTimeout y luego muestra el precargador durante 10 s adicionales en lugar de alinearse con el retraso.

¿Cómo puedo lograr esta funcionalidad?

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

animation-delay: 10s;

Debo señalar que esto es bastante malo en términos de experiencia del usuario a menos que planee reducir esos temporizadores.

about 4 years ago · Juan Pablo Isaza Report
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!