メッセージ画面を下にスクロールするJsの書き方を知りたい。

Question

前提・実現したいこと

Railsでchatアプリを作成中

メッセージ送信を行なった際、そのメッセージを画面の一番下までスクロールさせたい。

発生している問題・エラーメッセージ

現状ではメッセージ送信を行なった際、メッセージは画面の一番下に表示されるが、スクロールの動作自体は、画面の一番上まで戻ってしまう。

該当のソースコード

.done(function(data){
    function scrollBottom(){
        var target = $('.message').last();
        var position = target.offset().top + $('.messages').scrollTop();
        $('messages').animate({ scrollTop: $('messages')[0].scrollHeight});
        return false
 

試したこと

■ 仮説と検証作業の結果

仮説

何度かJsのコードを修正したが、解決には至らなかった。
そのため、Jsのコード上の問題ではなく、フロントの側のscssのコード上に問題があるのではないかと考えた。

検証
https://qiita.com/yuichir43705457/items/d49ef1dc3a1db6249897
以下の記事を参考にして、
overflow: scroll;を
overflow: auto;へを修正した
https://gyazo.com/2f0db6a1b5f99294270b1e43b581d561

結果
メッセージ画面を下にスクロールすることはできなかった。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。
Railsのバージョン　5.0.7.2

Answer 1

いまいち現象がよくわからないのですが

スクロールの動作自体は、画面の一番上まで戻ってしまう。

といいながら、

メッセージは画面の一番下に表示されるが、

というのは矛盾しているように感じますが、どんな動作なのでしょうか？

また、

var position

これが使われてないのは何故ですか？

Comments

[Higeoyazi]

大変申し訳ありません、説明が不十分でした。

現状としては、
メッセージ送信をした時、メッセージ自体は画面の一番下に保存される。
しかし、スクロール自体は、メッセージ画面の一番上に移動してしまう。
つまり、メッセージ送信はされるが、スクロール自体はページの一番上になされてしまうという現象が生じている。

コードについては、以下の記事を参考にして記述しました。
https://qiita.com/yuichir43705457/items/d49ef1dc3a1db6249897