jQuery外部链接锚动画

时间:2012-11-01 08:42:39

标签: javascript jquery

无法找到正确的答案。 我想打开页面然后动画滚动到我呼叫的ID

这是我的代码。

JQuery的

   $(window).bind("load", function () {
              var urlHash = window.location.href.split("#")[1];
                $('html,body').animate({ scrollTop: $('a[href="#' + urlHash + '"]').offset().top}, 1000);
    }); 

HTML

<div class="space"></div>
<div id="anchor">This is anchor</div>

CSS

.space{height:800px;}
#anchor{font-size:25px;height:800px;}

然后jQuery无效,所以我将以下代码粘贴到控制台

 $('html,body').animate({ scrollTop: $('a[href="#' + anchor+ '"]').offset().top}, 1000);

错误说

  

TypeError:无法读取未定义

的属性“top”

http://jsfiddle.net/4mjmw/1/

我怎么能解决这个错误?感谢

1 个答案:

答案 0 :(得分:3)

此代码有效:http://jsfiddle.net/4mjmw/4/

演示:http://jsfiddle.net/4mjmw/4/show/#abc

我在锚点添加了一个href,并将脚本移动到HTML。

$(window).bind("load", function () {
          var urlHash = window.location.href.split("#")[1];
            $('html,body').animate({ scrollTop: $('a[href="#' + urlHash + '"]').offset().top}, 1000);
      });