CODEWITHSUNDEEP
javascript
asafg8
asafg8

Reputation: 69

Scroll down animation js

I built a kind of chat in JS and then I wanted that when I got new message the chat automatically scrolled down (with animation...). Everything worked beautifully, but after the animation stopped the user couldn't scroll by himself; the chat automatically scrolled to the end.

So this is the code : 

<!-- language:lang-js -->

var height = 1;
window.setInterval(function() {
    var elem = document.getElementById('chat');
    elem.scrollTop = height;
    if (elem.scrollheight < height) {
        clearInterval(this);
    }
    height += 2;
}, 50);

Upvotes: 0

Views: 1090

Answers (2)

Ace
Ace

Reputation: 1467

you should make a var holding the interval like this :

var height = 1;
var interval = window.setInterval( animate, 50 );

function animate() {
    var elem = document.getElementById('chat');
    elem.scrollTop = height;
    if (elem.scrollHeight < height) {
        clearInterval( interval );
    }
    height += 2;
}

this should work fine

Upvotes: 0

Andrew
Andrew

Reputation: 13853

the clearInterval function expects a number. Using that should make it work correctly. You also have many syntax errors.

var intervalReference = window.setInterval(function() {
    var elem = document.getElementById('chat');
    elem.scrollTop = height;
    if (elem.scrollHeight < height) {
        clearInterval(intervalReference);
    }
    height += 2;
}, 50);

Upvotes: 1

Related Questions