Question

我在页面顶部有一个固定的菜单栏，所有菜单链接都是同一页面上的锚链接。简而言之，它是一个单页网站，分为锚链接作为菜单项。

当点击菜单项时，我正在使用下面的javascript平滑滑动到部分。

$(document).ready(function() {
    $("a.anchorLink").anchorAnimate()
});

jQuery.fn.anchorAnimate = function(settings) {

    settings = jQuery.extend({
        speed : 1100
    }, settings);   

    return this.each(function(){
        var caller = this
        $(caller).click(function (event) {  
            event.preventDefault()
            var locationHref = window.location.href
            var elementClick = $(caller).attr("href")

            var destination = $(elementClick).offset().top-60;
            $("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination}, settings.speed, function() {
                window.location.hash = elementClick-60
            });
            return false;
        })
    })
}

由于顶部菜单高度为60像素，我需要从offset（）。top中减去它以确保幻灯片正常工作。我还必须在位置哈希中减去其他有一个生涩的幻灯片（在FF和IE中，在Chrome中工作正常）一旦点击完成后滑动。

效果很好，但问题是网址显示为http://www.site.com/#NaN而不是http://www.site.com/#linkname

以下是完整代码 - http://jsfiddle.net/85saK/1/。不幸的是，它不会显示点击后以#NaN而不是实际链接ID结尾的URL，例如＃store，＃home或#contact。

Answer 1

尝试：

var destination = $(elementClick).offset().top -60;
$("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination}, settings.speed, function() {
    //window.location.hash = elementClick
    elementClick
});

JQuery偏移#NaN问题

1 个答案: