scrollIntoView () не работает на IOS Safari и chrome?

Question

Я новичок в javascript и программировании в целом, и пытаюсь использовать функцию scrollIntoView () безрезультатно.

Я тестировал приведенный ниже код на мобильных устройствах Android Chrome и Samsung Inte rnet, и он отлично работает, но на мобильных устройствах IOS Chrome и Safari он не

Когда я нажимаю любую из навигационных ссылок в горизонтальном меню прокрутки, скроллер перемещается полностью до конца в направлении ссылки «Справка» и также выделяет ее. (хотя go соответствует правильной странице, см. пример изображения ниже)

Изображение того, что я имею в виду

Работает ли scrollIntoView () в IOS (Iphone 6 версия и выше) всегда или я делаю что-то не так с тем, как я его использую?

HTML

<div id="navScroller" class="scrollmenu scroll example hide-on-desktop">
    <a id="dairyy" class="btn2" href="https://www.gourmetdirect.co/collections/dairy">dairy</a>
</div>

CSS

.activeA {
    //Places a red line underneath the link and makes the text white and bold.
    border-bottom: 3px solid red;
    font-weight: bold;
    color: white;
}

Javascript

 //Getting the url of the window
 var url = window.location.href;

 //Removing protocols
 var urlNoProtocol = url.replace(/^https?\:\/\//i, "");

 //if current page url is the same as the url of the specific product category page, set 'activeA' class which highlights the link

  if ( urlNoProtocol == "www.gourmetdirect.co/collections/seafood") {
       var element = document.getElementById("seafoodd");
       function myFunction() {
         var element = document.getElementById("seafoodd");
         element.classList.remove("activeA");
         element.classList.add("activeA");
         element.scrollIntoViewIfNeeded();
       };

      myFunction();
}