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

317
Views
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
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!