Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

318
Vistas
Polyfill function for scroll is not working in nextjs

window scrollIntoView doesn't work for safari and ipads. To resolve this issue, i have created a polyfill function following polyfill custom scroll. Following is the code i have written for this polyfill function for scroll. it is working fine for the blog that i have shared above but this is not working in my code as the flow of the code and usage is same but still no luck.

function scroll(element) {
    let start = null;
    const target = element && element ? element.getBoundingClientRect().top : 0;
    const firstPos = window.pageYOffset || document.documentElement.scrollTop;
    let pos = 0;
    (function () {
      const browser = ['ms', 'moz', 'webkit', 'o'];
      for (let x = 0, { length } = browser; x < length && !window.requestAnimationFrame; x++) {
        window.requestAnimFrame = (function () {
          return window.requestAnimationFrame
                  || window.webkitRequestAnimationFrame
                  || window.mozRequestAnimationFrame
                  || function (callback) {
                    window.setTimeout(callback, 1000 / 60);
                  };
        }());
        window.cancelAnimationFrame = window[`${browser[x]}CancelAnimationFrame`]
        || window[`${browser[x]}CancelRequestAnimationFrame`];
      }
    }());
    function showAnimation(timestamp) {
      if (!start) { start = timestamp || new Date().getTime(); }
      const elapsed = timestamp - start;
      const progress = elapsed / 100;
      const outQuad = function (n) {
        return n * (2 - n);
      };
      const easeInPercentage = +(outQuad(progress)).toFixed(2);
      console.log(easeInPercentage)
      pos = (target === 0) ? (firstPos - (firstPos * easeInPercentage)) : (firstPos + (target * easeInPercentage));
      window.scrollTo(0, pos);
      if (target !== 0 && pos >= (firstPos + target) || target === 0 && pos <= 0) {
        cancelAnimationFrame(start);
        if (element) {
          element.setAttribute('tabindex', -1);
          element.focus();
        }
        pos = 0;
      } else {
        window.requestAnimationFrame(showAnimation);
      }
    }
    window.requestAnimationFrame(showAnimation);
  }
  document.getElementById('seemorebutton')?.addEventListener('click', (e) => {
    e.preventDefault();
    scroll(document.getElementById('discoverEvents'));
  });
about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda