Meteor Iron路由器-路由器。可以回拨吗?
我有一个链接,我想让用户按下。当他们按下该按钮时,路由器将转到某个模板,然后运行Smoothscroll.js代码来设置动画并向下滚动到锚标记Meteor Iron路由器-路由器。可以回拨吗?,meteor,iron-router,Meteor,Iron Router,我有一个链接,我想让用户按下。当他们按下该按钮时,路由器将转到某个模板,然后运行Smoothscroll.js代码来设置动画并向下滚动到锚标记 //When the user clicks on the link to get to the #contact anchor... //The code below does not work. Router.go('index'); $('html,body').animate({
//When the user clicks on the link to get to the #contact anchor...
//The code below does not work.
Router.go('index');
$('html,body').animate({
scrollTop: $('#contact').offset().top
}, 1200);
Router.go('index')
工作正常
$('html,body').animate({
scrollTop: $('#contact').offset().top
}, 1200);
它本身也可以在索引模板上工作
但当我试图将它们一起运行时,路由器会转到索引,但滚动不起作用
你知道我该怎么做吗
编辑
这是我为最新的Meteor 1.0+提供的路径,如/#contact
Router.route('/', {
name: 'index'
});
Router.onAfterAction(function() {
var self = this;
// always start by resetting scroll to top of the page
$(window).scrollTop(0);
// if there is a hash in the URL, handle it
if (this.params.hash) {
// now this is important : Deps.afterFlush ensures that iron-router rendering
// process has finished inserting the current route template into DOM so we
// can manipulate it via jQuery, if you skip this part the HTML element you
// want to scroll to might not yet be present in the DOM (this is probably
// why your code fails in the first place)
Tracker.afterFlush(function() {
if (typeof $("#" + self.params.hash).offset() != "undefined"){
var scrollTop = $("#" + self.params.hash).offset().top;
$("html,body").animate({
scrollTop: scrollTop
});
}
});
}
});
除非你正在做一些花哨的事情,否则你可能不想使用
路由器。去让iron Router像往常一样在锚点击时管理路由
就滚动到元素而言,这是我正在使用的onAfterAction
钩子,它支持任何路由和任何哈希(/anyroute\anyhash
)
酷,我来试试。您在哪里可以找到Deps.autoFlush
?我在文档中找不到任何关于它的提及。它肯定不在流星手册中。嗨,只是想知道最新的流星1.0.2.1会是什么样子?另外,我在$(#…call.FYI创建了Meteor 1.0版本并发布为iron router发行版:@aginsburg,我已经更新了我的OP,以突出显示最新Meteor的代码。谢谢@FuzzyBabunny
Router.onAfterAction(function() {
// always start by resetting scroll to top of the page
$(window).scrollTop(0);
var hash=this.params.hash;
// if there is a hash in the URL, handle it
if (hash) {
// now this is important : Tracker.afterFlush ensures that iron-router
// rendering process has finished inserting the current route template
// into DOM so we can manipulate it via jQuery, if you skip this part
// the HTML element you want to scroll to might not yet be present in
// the DOM (this is probably why your code fails in the first place)
Tracker.afterFlush(function() {
var element=$("#"+hash);
var scrollTop = element.offset().top;
$("html,body").animate({
scrollTop: scrollTop
});
});
}
});