平滑滚动功能卡在Chrome中

时间:2017-03-06 06:57:26

标签: javascript jquery html css google-chrome

单击导航链接并滚动到目标后,我页面上的平滑滚动功能似乎卡住了:

http://www.samnorris.net/portfolio-ss/

在Chrome浏览器中,鼠标滚动似乎会因为某些奇怪的原因而在发布之前停留约2-3秒。在Firefox中运行良好。

这是我的代码:

    ///////////////////////////////////////////////////////////////////////////
// Scroll Functions
///////////////////////////////////////////////////////////////////////////

if($(window).scrollTop()!=0){
    calculatepositionmenu();
};

$(window).on('scroll',function(){

    //Top menu
    calculatepositionmenu();

    //select menu section
    $("body section").each(function (index) {
        if($(this).isOnScreen()){
            $('#mainMenu a').removeClass('select');
            $('#mainMenu a[href="#'+$(this).attr('id')+'"]').addClass('select');
        }
    });
});


///////////////////////////////////////////////////////////////////////////
// Main menu scroll to
///////////////////////////////////////////////////////////////////////////

$("#mainMenu a,#mainheader a").on('click', function() {
    $("#menu-container").removeClass('open');
    if($(this).data("scrollto")){
        $('html, body').animate({
            scrollTop: $($(this).data("scrollto")).offset().top
        }, 1200);
        return false;
    }
});

HTML:

<div id="menuWrapper">
<section id="menu-container">
    <div class="container">
        <div id="mainMenu">
            <!-- Site logo-->
            <a class="menulogo logo" href="#" data-scrollto="#mainheader">
                <img alt="Sam Norris - Online Portfolio" src="$ThemeDir/img/menu-logo.png"></a>
            <nav>
                <!-- Principal menu -->
                <a href="#" data-scrollto="#about">The Man</a>
                <a href="#" data-scrollto="#services">The Plan</a>
                <a href="#" data-scrollto="#work">My Work</a>
                <a href="#" data-scrollto="#process">My Process</a>
                <a href="#" data-scrollto="#contact">Contact</a>
                <a href="#" data-scrollto="#blog">Blog</a>
            </nav>
        </div>
    </div>
</section>

任何帮助都会非常感激。欢呼声。

1 个答案:

答案 0 :(得分:0)

您的服务器在http://www.samnorris.net/portfolio-ss/themes/portfolio/js/main.js将主javascript文件标记为包含恶意代码,因此将其返回为403/404 - 因此您网站上的脚本未加载。

查看浏览器的控制台窗口。以下是它的屏幕截图:screesnhot

解决方案是自行更改服务器设置或与主机联系。