Перейти к определенной части HTML-страницы по внешней ссылке не работает

Я создал страницу с внутренними переходами к определенному разделу внутри div с указанным идентификатором. Работает нормально (внутри).

localhost/index.html#career-div
localhost/index.html#about-div

У меня есть элементы с идентификаторами career-div и about-div.

Когда я попытался перейти с другой страницы (скажем, contact.html) на index.html с хэштегом, он не перешел к определенному разделу!!

<a href="index.html#career-div">Career</a>

<div class="container">
  <div id="career-div" class="content-block-div">
  </div>
</div>

Приведенный выше код просто загружает страницу index как обычно, но не переходит к указанному идентификатору. Я также попробовал атрибут имени, но это не сработало!

Если я нажму клавишу ввода в адресной строке, страница подпрыгнет, как и должна! Я хочу, чтобы это плавно прокручивалось после переключения страниц.

Функция, которую я использую для плавной прокрутки к цели и управлению классом кнопок, находится здесь:

 $(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);

           if(this.hash == '#content-spacer')
           {
             $('#button-home').addClass('active');
             $('#button-about').removeClass('active');
             $('#button-services').removeClass('active');
             $('#button-careers').removeClass('active');
             $('#button-contact').removeClass('active');
           }
           else if(this.hash == '#about-spacer')
           {
             $('#button-about').addClass('active');
             $('#button-home').removeClass('active');
             $('#button-services').removeClass('active');
             $('#button-careers').removeClass('active');
             $('#button-contact').removeClass('active');
           }
           else if(this.hash == '#services-spacer')
           {
             $('#button-services').addClass('active');
             $('#button-about').removeClass('active');
             $('#button-home').removeClass('active');
             $('#button-careers').removeClass('active');
             $('#button-contact').removeClass('active');
           }
           else if(this.hash == '#career-spacer')
           {
             $('#button-careers').addClass('active');
             $('#button-services').removeClass('active');
             $('#button-about').removeClass('active');
             $('#button-home').removeClass('active');
             $('#button-contact').removeClass('active');
           }
           else if(this.hash == '#contact-spacer')
           {
             $('#button-contact').addClass('active');
             $('#button-careers').removeClass('active');
             $('#button-services').removeClass('active');
             $('#button-about').removeClass('active');
             $('#button-home').removeClass('active');
           }
           return false;
       }
     } 
  });
});