localscroll的哈希选项,滚动时闪烁页面。如何使滚动顺畅

时间:2010-02-22 07:41:46

标签: javascript jquery jquery-plugins

我正在实现一个jquery插件(localscroll)来平滑滚动到带有页面的命名锚元素。 localscroll支持一个名为'hash'的选项,它基本上做的是将命名的锚点哈希附加到URL中,使用户可以使用浏览器后退/前进按钮轻松地进行书签和移动。


HTML

<ul id="navigation" class="main_menu">
    <li><a href="#panel_home">Home</a></li>
    <li><a href="#panel_story">Story</a></li>
    <li><a href="#panel_mantra">Mantra</a></li>
    <li><a href="#panel_showcase">Showcase</a></li>
    <li><a href="#panel_experience">Experience Us</a></li>
</ul>

Javascript (jquery)

$(document).ready(function () {
    $("#navigation").localScroll({
        offset: {left: 0, top: -56},
        hash: true,
        easing: 'easeInOutExpo'
     });
});

上面的代码运行正常,但是无论何时单击链接,滚动都会以闪烁开始(可能是因为浏览器的默认行为是跳转到命名锚点)。这种闪烁的东西在Firefox中比Chrome或Safari更明显,并且是一个很大的NO-NO。如何使用反映当前命名锚点的地址栏来平滑过渡?任何帮助深表感谢。感谢名单!

1 个答案:

答案 0 :(得分:0)

我发现为什么我的页面在点击与localscroll映射的链接时闪烁。我在localscroll.js文件之后包含了jquery.js文件,这导致了这种奇怪的行为。因此,我在单个.js文件中包含了我在脚本中使用的jquery,localscroll,easing和其他javascripts的所有缩小版本,这解决了这个问题。

相关问题