jQuery动画滚动

时间:2011-11-08 08:00:58

标签: jquery user-interface scroll effects

我不确定如何调用效果,但是有人可以指引我进入一个可以帮助我发挥与此网站相同效果的库吗?

http://www.makr.com

基本上,它会在鼠标单击时将行向上移动到页面顶部。如果没有这样的专用效果库,代码片段(最好是jQuery)可以提供帮助。

我不确定我是否需要开始另一个主题,但是任何人都可以帮助我使用一个小的jQuery片段来实现Makr UI的整体效果吗?

5 个答案:

答案 0 :(得分:202)

您可以使用jQuery为页面的滚动顶部设置动画。

$('html, body').animate({
    scrollTop: $(".middle").offset().top
 }, 2000);

查看此网站: http://papermashup.com/jquery-page-scrolling/

答案 1 :(得分:5)

你也可以试一下我开发的一个简单的jquery插件(AnimateScroll),很多人都很喜欢!

答案 2 :(得分:1)

我只是使用:



$('body').animate({ 'scrollTop': '-=-'+<yourValueScroll>+'px' }, 2000);
&#13;
&#13;
&#13;

答案 3 :(得分:1)

var page_url = windws.location.href;
var page_id = page_url.substring(page_url.lastIndexOf("#") + 1);
if (page_id == "") {
    $("html, body").animate({
        scrollTop: $("#scroll-" + page_id).offset().top
    }, 2000)
} else if (page_id == "") {
    $("html, body").animate({
        scrollTop: $("#scroll-" + page_id).offset().top
    }, 2000)
}

});

答案 4 :(得分:0)

有一个jquery插件。它将文档滚动到特定元素,以便它完美地位于视口中间。它还支持动画缓动,使滚动效果看起来非常流畅。查看AnimatedScroll.js