jQuery简化了Firefox中窗口滚动的动画(bug还是我的坏？)

Question

示例
首先,这是我的代码和问题:http:
//www.nathanstpierre.com/MBX/showoff.html

问题
所以我看到的是,当您单击左侧的按钮时,窗口会滚动到相应的标题.在每个浏览器中,但Firefox(包括...... IE 喘息)这是非常顺利的.但是,如果减小窗口的高度,它将在所有计算机上变得平滑.我已经在多台计算机和IE 7-8,谷歌浏览器,Safari和Firefox 3.5上试过了这个.我已经消除了页面上的所有图形和颜色,所以这些都不是问题.我已经摆脱了跟随你的侧边栏,那不是它.

理论
我认为jQuery缓动插件会计算你需要去的距离,然后按照指定的持续时间单位划分它需要移动的像素数(比如300像素超过30毫秒,所以10px/ms) .每个其他浏览器似乎都能够实现平滑过渡,但是窗口滚动事件提供的粒度可能不足以让Firefox显得流畅吗？或者我可能使用了错误的缓动插件或错误的设置.

代码

$("#sidenav a").click(function () {
        $("#sidenav a").animate({'color':'#6d6d6d'},{"duration":400});
        $(this).animate({"color":"#fff"},{"duration":400});
        clicktarget=$(this).attr("href");
        $("html, body").animate({scrollTop: $(clicktarget).offset().top},{"duration":300,"easing":"easeout"});
        return false;
      });

逻辑

为sidenav onClick上的每个标记添加一个事件监听器.这将获得文档中元素的offset().顶部,其ID与该链接的href属性相同,然后从当前scrollTop动画到该元素的offset().top.逻辑是合理的,并且在每个浏览器中都能顺利运行,除了Firefox ......据我所知.

PLEA

我究竟做错了什么？这是一个错误吗？

谢谢!

更新

好吧,我不能凭良心选择这里提出的任何答案,因为他们都没有真正解决这个问题,所以如果你跟随这个选择你最喜欢的和赏金将去最高的那个票.

问题似乎是Firefox a)呈现透明度和b)处理滚动事件的方式.可能具有足够的处理器能力这是一个无问题,但令我难过的是IE(所有浏览器)能够在劣质硬件上呈现这一点.我将向Mozilla提出这个问题,看看他们是否有任何关于它的话题.

如需额外的装饰,免费提供以下服务:

透明度
没有透明度

编辑:所以问题已得到解答,但现在我无法选择它.任何人都知道这是怎么回事？

最终更新 已经过了足够的时间,他们让我得到赏金,所以我选择了正确的答案.看起来像box-shadow和一些其他效果会导致firefox中的一些滚动问题,因为它们呈现的方式.FF 4.0 +处理得更好,但有些计算机仍有问题.对于实现CSS3的人来说,这是一个很好的选择:在所有浏览器上测试交互,看看性能成本是否合理.

Answer 1

性能不佳似乎是由该属性引起的-moz-box-shadow，如果删除该属性的任何声明（或使用 Firebug 禁用它们），滚动动画会更加平滑。