我有一个标准菜单和JS,用于在锚之间平滑滚动。 当我点击其中一个锚时,它什么也没做,但我在开发工具中得到了一个错误。
这是我的菜单:
<div class="menu anc">
<ul class="nav menu">
<li class="item-111"><a href="#stills">stills</a></li>
<li class="item-112"><a href="#art">art</a></li>
<li class="item-113"><a href="#interactive">interactive</a></li>
<li class="item-114"><a href="#about">about</a></li>
<li class="item-115"><a href="#contact">contact</a></li>
</ul>
</div>
JS部分:
$( document ).ready(function() {
$("header ul.menu li:first-child").addClass('active');
$(".anc a").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(this.hash).offset().top}, 500);
});
});
http://jsfiddle.net/amitt314/tXaLC/5/
和crome开发工具的错误:
> Uncaught TypeError: Cannot call method 'offset' of null script.js:18
> (anonymous function) script.js:18 x.event.dispatch jquery.js:4676
> y.handle jquery.js:4360
为什么锚返回NULL值?当我试图删除脚本时,一切正常。
答案 0 :(得分:1)
$( document ).ready(function() {
$("header ul.menu li:first-child").addClass('active');
$(".anc a").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$(event.target.hash).offset().top}, 500);
});
});
答案 1 :(得分:0)
已更新您必须先包含jquery
,然后尝试使用$($(this).attr('href'))
代替$(this.hash)
,
$(".anc a").click(function(event){
event.preventDefault();
$('html,body').animate({scrollTop:$($(this).attr('href')).offset().top}, 500);
});
答案 2 :(得分:0)
我发现了问题。这是一个jQuery冲突。
可能其中一个组件将jQuery加载到我的页面并导致此冲突。