1

我在http://www.optiekmeulemeester.be/normal有一个带有滑动导航的网页。这发生在以下代码中:

$(".link").click(function(){
  var link = $(this).attr('href');
  $("#middle").scrollTo(link, 800);
  return false;
});

这可行,但现在我正在尝试使用 jQuery 地址(http://www.asual.com/jquery/address/)启用后退按钮。我的代码已更改为:

$.address.change(function(event){
  var link = event.pathNames[0] || '#panel1'; 
  if(link != '#panel1'){ link = '#' + link;}
  $("#middle").scrollTo(link, 800);
});

所有 .link 点击的代码也被注释掉,返回 false。

我的后退按钮已启用,并且大多数情况下它都可以正常工作,您可以在http://www.optiekmeulemeester.be/test看到和测试。我确信它需要针对特殊情况进行调整,但在我开始之前,最大的问题是我的动画不再工作了。

*编辑:我现在看到它有时有效,有时无效。找不到其中的逻辑。以及通过后退按钮单击链接?!?有人知道我的错误吗?

这是因为对动画的调用是在地址通过标准 a(nchor) 行为更改之后发生的吗?

提前致谢。

4

2 回答 2

1

我找到了 1 个答案,但可能是一种解决方法:

$.address.change(function(event){
  var link = event.pathNames[0] || '#panel1';
  if(link != '#panel1'){ link = '#' + link;}
  $("#middle").scrollTo(link, 800);
});

$(".link").click(function(){
  var link = $(this).attr('href');
  $("#middle").scrollTo(link, 800);
  return true;
});

$.address.change 函数中的相同代码 + $(".link").click 中的另一个时间 + 返回 true 以便触发 address.change。

现在工作:)。如果你有更好的东西请告诉我!

于 2010-08-02T14:24:38.813 回答
1

尝试以下操作:

$.address.change(function(event){
  $("#middle").scrollTo('#' + (event.pathNames[0] || 'panel1'), 800);
});

$(".link").address();

几个建议:

  • 为链接使用口语名称,而不是 panel1、panel2 等。
  • 尝试在容器的 ID 和地址值之间做出一些区别,因为浏览器可能会强制执行一些内置行为来滚动到正确的位置。考虑启用脚本模式作为此选项。
  • 对第一个面板使用空值,这样您就可以为第一页设置一个唯一值,而不是“”和“panel1”。
  • 考虑使用应该修复一些内置滚动的插件的 wrap 选项。
于 2010-08-03T18:30:00.157 回答