Question

我不知道为什么这对我不起作用。也许其中一个jQuery Guru可以帮助我完成这项工作！

从下面的脚本中你可以看到我有一个名为5的UL块，我想放松到那里锚（#web）。当我点击菜单项时，我确实要启动警报，所以我认为该部分是正确的。

$(function() {
$('ul.five a').bind('click',function(event){
    var $anchor = $(this);
    alert('hellooo')
    $('html, body, section').stop().animate({
        scrollTop: $($anchor.attr('href')).offset().top
    }, 500,'easeInOutExpo');

    event.preventDefault();
});

}）;

这是我的一个部分看起来如果这会有帮助吗？

<section class="row divider-down" id="section1">
<header>
    <h1><img src="image/image1.png" alt="Alt"></h1>
    <p>some text</p>
</header>

有人在这里看到任何明显错误的东西吗？就像我说警报弹出，但它没有“缓和”到该部分？

Answer 1

我觉得你很亲密。两件事：

将动画内容更改为$('body')
除非您包含jQuery UI，否则不能使用'easeInOutExpo'（请参阅下面的编辑）。

试试这个：

$(function() {
    $('ul.five a').bind('click',function(event){
        var $anchor = $(this);
        var $section = $($anchor.attr('href')); 
        if (!$section.length) { return; } // bail if there is no section

        $('body').stop().animate({ // only scroll the body
            scrollTop: $section.offset().top
        }, 500); // must remove 'easeInOutExpo' or include jQuery UI

        event.preventDefault();
    });
});

编辑：：

<强>缓解

.animate（）的剩余参数是一个命名缓动函数的字符串   使用。缓动函数指定动画进展的速度   动画中的不同点。唯一的缓和实现   jQuery库是默认的，称为swing，是一个在a进展的库   恒定的步伐，称为线性。更多的缓和功能可用于   使用插件，最着名的是jQuery UI套件。

因此，除非您在页面上添加了jQuery UI，否则不能使用'easeInOutExpo'。

jQuery Easing插件不宽松？

1 个答案: