滚动到jquery中的上下元素。

Question

我想要滚动到一个元素，如whatsapp搜索

当用户单击时，search (here it is bottom)应该滚动到最后一个元素

元素具有id chat-7。当单击up button时，应该滚动到chat-6，然后是chat-5，..and，等等。

如果单击down button，它应该滚动到向下，如果不是最后一项。

​

function scroll(id){
    console.log(id);
    $(".container").animate(
        { 
            scrollTop: $("#"+id).offset().top
        },
        "fast"
    );
}

​

完整代码在这里http://jsfiddle.net/p3kar5bb/231/

不幸的是，这段代码不能正常工作。

Answer 1

因为您的div .container没有滚动条，所以您可以做两件事。

1.有生命的身体

$("body").animate({ scrollTop: $("#"+id).parent('.item').offset().top}, "fast");

演示

2.将最大高度设置为div

.container{
   height: 100%;
   overflow-y: scroll;
   max-height:200px;    
  }

演示

Answer 2

在身体上而不是在.container上执行动画

function scroll(id){
console.log(id);
$("body").animate({ scrollTop: $("#"+id).offset().top}, "fast");

}

还设置了

var pointedPosition=0;

小提琴http://jsfiddle.net/p3kar5bb/234/

Answer 3

$('html, body').animate({
scrollTop: $("#"+id).offset().top
}, 500);

http://jsfiddle.net/p3kar5bb/231/中给出的代码很好，只需如上更改动画()即可。

刚刚尝试过- $('html')在Chrome中不工作，$('body')在Firefox中不工作，所以$('html，body')是必需的。同时调用.stop()也是一件好事。