防止/停止发生自动锚链接

时间:2009-03-31 23:57:54

标签: javascript jquery

使用link.html#idX和< div id =“idX”/>时,我需要阻止浏览器中的自动滚动行为。

我试图解决的问题是我正在尝试通过检测网址中的锚来对页面加载执行自定义滚动功能,但到目前为止还无法阻止自动滚动功能(具体而言)在Firefox)。

有什么想法吗?我在$(window).load()处理程序上尝试过preventDefault(),它似乎不起作用。

让我重申这是针对滚动页面中未点击的链接;它适用于滚动页面加载的链接。想一想点击链接中带有#anchor的其他网站的链接。什么阻止自动滚动到id?

每个人都明白我不是在找一个解决方法;我需要知道是否(以及如何)阻止在页面加载时自动滚动到#anchors。


注意

这不是真的问题的答案,只是一个简单的竞争条件风格的kluge。

使用jQuery的scrollTo插件滚动回页面顶部,然后使用自定义内容恢复滚动。如果浏览器/计算机足够快,页面上没有“闪烁”。

我觉得很脏,只是暗示这个......

$(document).ready(function(){

    // fix the url#id scrollto "effect" (that can't be
    // aborted apparently in FF), by scrolling back
    // to the top of the page.
    $.scrollTo('body',0);

    otherAnimateStuffHappensNow();

});

信用转到wombleton指出。谢谢!

4 个答案:

答案 0 :(得分:6)

This似乎是我可以看到的唯一选项:

$(document).ready(function() {
  $.scrollTo('0px');
});

它不会自动滚动到类。

因此,如果你用独特的类来识别你的div,你会在查找元素时失去一点速度,但会获得你所追求的行为。

(顺便说一句,谢谢你指出了滚动到id的功能!从来不知道它存在。)

编辑:

答案 1 :(得分:1)

  1. 先滚动到顶部(快速,无效果),然后调用滚动功能。 (我知道它不那么漂亮)
  2. 或只使用前缀

答案 2 :(得分:1)

我知道这是一个旧线程,但我找到了一些不需要滚动的东西。在任何其他脚本之前先运行此命令。它会在页面上的第一个元素之前放置一个锚点,以阻止滚动,因为它位于页面顶部。

function getAnchor(sUrl)
{
  if( typeof sUrl == 'string' )
  {
   var i = sUrl.indexOf( '#' );
   if( i >= 0 )
    { return sUrl.substr( i+1 ).replace(/ /g, ''); }
  }
  return '';
};

var s = getAnchor(window.location.href);
if( s.length > 0 )
 { $('<a name="'+s+'"/>').insertBefore($('body').first()); }

干杯! Erwin Haantjes

答案 3 :(得分:0)

这对我很有用:

1-把它放在你的css文件

a[name] { position: absolute; top: 0px }

2-在你开始动画之前把它放在你的document.ready bind上(如果你动画的话)

$("a[name]").css("position","relative");

可能需要调整,具体取决于你的样式表/代码,但你明白了。

感谢:http://cssbeauty.com/skillshare/discussion/1882/disable-anchor-jump/