当在另一个页面上单击链接时，试图使这个WordPress主题滚动到一个id

Question

解释它的最简单方法是查看网站-haloespresso.com.au/working/

如果单击顶部菜单中的“菜单”选项，它将滚动到菜单ID＃pg-9-4，这正是我想要的。 在其他页面上，菜单略有不同，并且相同的链接被更改为链接到首页，并在其末尾添加了＃pg-9-4。 显然，这里的要点是从另一个页面获取链接以打开主页，但滚动到其菜单部分。 我什至不需要它来平滑滚动或其他任何东西，只是去那个地方。 看起来好像确实正在加载一帧，但它一直跳到顶部。 试图找出导致其失去此基本HTML（afaik）功能的原因，并不断迫使我进入页面顶部，这完全超出了我的范围...

任何帮助都将非常有用，因为除了html / css和简单的jquery之外，我还是有点菜鸟。

Answer 1

只需将锚点附加到链接的末尾即可。

只需插入一个链接，如：

<a href="/someotherpage.html#section4">Link to section on another page</a>

编辑：只是注意到您没有使此工作。 您的链接是什么样的？目标页面上ID为的HTML是什么？

Answer 2

试试这个jQuery代码：

$(document).ready(function() {
   function hashScroll() {
      // get URL Hash
      var hash = window.location.hash;

      // check if hash is set and not empty
      if (hash != '') {
         // scroll to hash ID after 10ms delay
         setTimeout(function() {
            $(document).scrollTop( $(hash).offset().top );
         }, 10);    
         // debugging
         console.log(hash);
         console.log('offset:'+ $(hash).offset().top );
     }  
   }
   hashScroll(); // fire hash scroll function
});

说明：

此函数将捕获URL哈希（www.example.com/ #hash ），检查它是否不为空，然后在10毫秒后将页面滚动到ID与哈希匹配的元素。 这样做是为了确保浏览器不会干扰加载过程的延迟。