Clickable Anchor Navigation that doesn't work on Google Chrome

I've been searching for a solution for a problem with a javascript that works on IE, Firefox, Safari and Edge. But when I want to use it on Chrome, it doesn't work.

I've tried a couple of solution I found here, about anchor scrolling, but none work, maybe someone can find a solution? Here is the code for the anchor I've been using.

<div class="link"><div class="name">PersoName</div><a class="scroll" href="#NAMEID"></a></div>

And this is where the anchor is suposed to go

<div class="box" id="NAMEID" style="background:url('https://nsm09.casimages.com/img/2019/02/22//19022209080424648216131014.png')no-repeat center top fixed; background-color: #EEEEEE; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover;">

If you need to see it in action this is my test:

https://morganpierce1329.tumblr.com/testperso

I'm not sure what's the root cause of your issue, but searching around I found a fix for it. You can add the following code to your Javascript and it should work out just fine (tested it on Chrome console):

$(function() {
   $('a[href*="#"]:not([href="#"])').click(function() {
     if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
       var target = $(this.hash);
       target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
       if (target.length) {
         $('html, body').animate({
           scrollTop: target.offset().top
         }, 1000);
         return false;
       }
     }
   });
 });