Question

我在我的网站上使用Anchor，它完全可以正常工作，直到刷新页面并单击另一个锚点，然后全部崩溃，我只看到白屏。但是，如果我更改了窗口的大小或再次刷新，则一切都会正确返回。

我试图删除滚动效果，更改ID的锚点位置并添加 onClick="location.reload()，但仍然存在相同的问题。

当我使用移动视图（通过计算机上的f12）并且我没有任何刷新和定位问题时，一切正常，但仅在移动版本中有效。

here what i see when i should see 3 images with text and titles.

这是我的导航栏和锚点

    <div id="bloc" style="display:none"> // hide the page until its not fully loaded
  <div class="en-tete">
    <div class="wrapper">
      <header>
        <nav>
            <div class="menu-icon">
              <i class="fa fa-bars fa-2x"></i>
            </div>
            <div class="menu">
              <ul>
                  <li><a href="#competences">COMPETENCES</a></li>
                  <li><a href="#qualifications">QUALIFICATIONS</a></li>
                  <li><a href="#portfolio">PORTFOLIO</a></li>
                  <li><a href="#contact">CONTACT</a></li>
              </ul>
            </div>
        </nav>
      </header>
  </div>

这是我CSS中的代码

/* scrolling effect */
body {
    scroll-behavior: smooth;
  }

这是我的js文件

// scrolling effect //

$(document).ready(function(){
  $("a").on('click', function(event) {

    
    if (this.hash !== "") {
      event.preventDefault();

      var hash = this.hash;

      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 800, function(){

        window.location.hash = hash;
      });
    }
  });
});

我所有的文件都在php中，感谢您的帮助

我刷新页面后锚不起作用

0 个答案: