jQuery的scrollTop只能工作一次

我正在使用这段代码来打开一个 div 并向下滚动到它。它工作得很好，但只有我第一次使用它，即使在页面刷新时它也不会再工作。有谁知道为什么会发生这种情况？提前致谢!

这是网址( www.patrickorr.ca )

$(document).ready(function() { 
$("div.ftropen") 
    .click(function(){ 
        $("div#connect").animate({height: "500px" }, "fast");                                               
        $("div#ftrconnect").fadeOut("fast");  //hide connectbtn 
        $("div#ftrhide").fadeIn("fast");  //show hidebtn 
        $("#connect").scrollTop($("#connect").scrollTop() + 500); 
    return false; 
}); 
$("div.ftrclose") 
    .click(function(){ 
        $("div#connect").animate({height: "0px" }, "fast");                                             
        $("div#ftrhide").fadeOut("fast");  //hide hidebtn 
        $("div#ftrconnect").fadeIn("fast");  //show connectbtn 
    return false; 
}); 
}); 

请您参考如下方法:

jquery.anchor.js 似乎有问题给我的图书馆 Uncaught TypeError: Cannot read property 'top' of null jquery.anchor.js:32在 Chrome 14 中。我已将其注释掉，并将 open 函数替换为:

$("div.ftropen").click(function(){ 
    $("div#connect").animate({height: "500px" }, "fast", function() { 
        $("body").scrollTop( $("#connect").position().top); 
    });                                     
    $("div#ftrconnect").fadeOut("fast");  //hide connectbtn 
    $("div#ftrhide").fadeIn("fast");  //show hidebtn 
    return false; 
}); 

将正文滚动到 <div id="connect"> 的顶部

我会看看是否能让 anchor 动画插件工作......

实际上是Anchor Slider插件似乎干扰了您的 <div>完全点击事件。 <a>单击首先发生并消耗该事件。我认为您需要决定使用 Anchor Slider 插件来动画“滚动到”或 jQuery animate()在您的代码中。

编辑:如果删除 jquery.anchor.js脚本，使用以下目标

<div id="connect" style="height:0px; display:block;"><a style="display:block;margin-top:500px;height:100px;" id="target" name="target">f</a></div> 

和这个 JavaScript:

$(document).ready(function() { 
    $('div.ftropen').click(function(event){ 
        $('div#connect').animate({height: '500px' }, 'fast', function() { 
            $('body').animate({scrollTop : $('#target').position().top + 500}, 700); 
        }); 
        $('div#ftrconnect').fadeOut('fast');  //hide connectbtn 
        $('div#ftrhide').fadeIn('fast');  //show hidebtn 
        event.stopPropagation(); 
        return false; 
    }); 
    $('div.ftrclose') 
        .click(function(){ 
            $('div#connect').animate({height: '0px' }, 'fast'); 
            $('div#ftrhide').fadeOut('fast');  //hide hidebtn 
            $('div#ftrconnect').fadeIn('fast');  //show connectbtn 
        return false; 
    }); 
}); 

动画滚动到 <a id="target">当 <div>高度动画已完成。

编辑2: Added a demo .