锚标签链接到具有动画的不同页面上的ID

Question

我有2页的网站，我正在尝试将第二页链接回div所在的第一页。

<li class="menuitem">
    <a href="index.html#services">Go Back</a>
</li>

它通过id标签服务转到div，并将id标签留在地址栏上。

我正在尝试将其设置为动画并从地址栏中删除id标签。

这就是第1页的样子-

<div id="home"></div>
<div id="about"></div>
<div id="gallery"></div>
<div id="services"></div>
<div id="contact"></div>

用于在同一页面中链接div的jquery-

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

Answer 1

使用window.location.hash可以读取和写入哈希值。 因此，在pageload上，您基本上可以执行以下操作：

$("html, body").animate({ 
   scrollTop: $('#'+window.location.hash).offset().top 
}, 1000);
window.location.hash='';

Answer 2

加载URL后，您不能再修改它，您必须处理您的请求

http://api.jquery.com/focus/

尝试使用Cookie存储，然后使用jquery，您可以专注于那一个

或者使用javscript

window.onload=getloaded();
function getloaded() {    
      var g=document.URL ;
      if(g.indexOf('services')!=-1) {
          // focus on services
      }
}

或像这样

$('html,body').animate({scrollTop:$("#your element").offset().top},'slow');

Answer 3

只需将锚标签与

href="my_page.html#my_anchor_name"

如果页面属于同一域，它将滚动到页面my_page.html id等于my_anchor_name任何html元素。 如果要在同一页面内链接，只需省略页面名称my_page.html 。