滚动到Sammy.js项目中的锚点链接

时间:2012-02-19 17:08:25

标签: jquery sammy.js

我正在使用sammy.js框架构建一个网站。我有一个常量的侧边栏,以及在sammy的帮助下加载不同页面的主要内容视图。在侧栏我有新闻文章的链接。目前,侧边栏上的任何文章链接都只加载#/ news路线。但我希望它加载路线并向下滚动到文章。我已经尝试在加载路径后向下滚动到文章时有一个锚点链接触发器,但我得到了sammy应用程序的错误。有关如何实现这一点的任何想法?

1 个答案:

答案 0 :(得分:5)

似乎是一个古老的问题,但因为它还没有答案......

您必须将您的URL定义为正则表达式,并在其末尾允许可选的书签哈希:

get(/#\/news(#.+)?/, function() {
    var articleId = this.params['splat'];
});

这将匹配以下任何路线:

  • #/消息
  • #/消息#
  • #/新闻#我的新闻,文章

然后,您应该能够使用articleId查找匹配元素并手动滚动。例如在上面的最后一条路线中,'articleId'将是'#my-news-article',所以使用jQuery你可以做类似的事情:

var $article = $(articleId);
    $(document.body).animate({ scrollTop: $article.offset().top });
});

希望有所帮助。