Jquery / Javascript滚动到只有类元素的页面中的div

Posted 2023-05-09

【中文标题】Jquery / Javascript滚动到只有类元素的页面中的div

【英文标题】：Jquery / Javascript scroll to div in page with only class element

【发布时间】：2014-11-07 17:17:29

【问题描述】：

我知道您可以使用 id 和 name 元素滚动到网页的不同部分，但这里有一些不同之处。我正在使用来自 Croma 的名为 Dumanis 的 WordPress 主题，他们的 div 只提供类，而不是 Id。因此，我试图找到一种方法来单击导航菜单中的某些内容，以将人们带到正确的 div 类元素。我将如何做到这一点？我看到很多人提到 scrollTop 但在这种情况下，我不希望它完全滚动到顶部，否则顶部的社交媒体栏会覆盖部分 div。怎么办？

到目前为止的页面如下： http://www.aishla.com/blog/2014/my-aish/

【问题讨论】：

从元素的 offsettop 中减去并相应地设置 scrolltop 很简单

【参考方案1】：

您可以使用.eq() 从包含链接的UL 列表中获取元素，然后您可以使用contains() 获取划分部分的H2 元素的文本，这是一个模型：

jQuery('#sub-nav a').click(function(e)
    e.preventDefault();
    jQuery(window).scrollTop(jQuery('h2:contains("Contact")').offset().top - jQuery('h2:contains("Contact")').outerHeight());
);

当然，这只是将每个链接都指向contact 部分，但您可以轻松地从中抽象出来。

将其插入控制台，您就会看到。

【讨论】：

你是对的。工作得很好！现在我只需要弄清楚 scrollTop -100 左右像素。刷新示例，您将看到问题。