如何使用标头滚动到特定的ID？

Question

就像链接：http://getbootstrap.com/css/#type

在这里，打开此链接时，窗口将自动滚动到type id。

他们是怎么做到的？

我的意思是，如何滚动到一个特定的id在同一个页面上使用标题，如some.com/post/#id，请评论下面，如果你需要更多的澄清。

编辑2:好的，home.php#26，这是有效的..。

但这只在页面已经加载的情况下才能工作，然后我更改标题..当页面第一次加载这个url时，我希望它能够工作。

就像当您打开http://getbootstrap.com/css/#type时，它会自动将您转到id "type“。但是当我加载我的网站/ does .php？#26时，它什么也做不了。

Answer 1

如果要使用标头，首先在目标GET变量中包含要滚动到的id。

例如- /home.php?target=12 (12是这里的id )

然后使用以下脚本：

$(window).load(function(){
    $('html,body').animate({ scrollTop: $('#<?php echo $_GET['target'];  ?>').offset().top - 100 }, 'slow');
});

这是你的卷轴加上酷的jQuery效果。:)

Answer 2

您只需要在url的末尾提供一个id。

就像yoursite.com/page/#yourid。

在你网站的某个地方，<div id="yourid"></div>。

您已经完成了，这不会动画滚动，如果您想要动画滚动使用，jquery animate函数。