Achieve scroll behavior like WhatsApp

Unanswered

American black bear posted this in #help-forum

American black bearOP

2023-12-05T05:58:31.000Z

I am creating a chat application. I want when I visit my chat page, it shows the last message. I have tried with the scrollBottom function. But it starts scrolling when I visit my chat page. But you can check WhatsApp. WhatsApp doesn't need to scroll to show the last message. I want this system. When I use height:auto in my image, the scroll bottom function also does not work properly. My goal is, to achieve scroll behavior like WhatsApp.

3 Replies

American black bearOP

2023-12-05T06:05:14.000Z

@Siberian please help

English Angora

2023-12-05T06:30:06.000Z

I'm thinking you can do the reverse of this where you scroll up to see more posts instead of down:
https://mark-valentino.vercel.app/blog
The code is here.
https://github.com/M-Valentino/M-Valentino_Node/blob/main/src/pages/blog.jsx
The key takeaway here is that all the posts in the blog are sliced and mapped. When the user scrolls, the slice of the blog posts are increased.

Rain infotech

2023-12-05T09:18:06.000Z

I would like to propose a solution for the challenge you're facing

  window.onload = function() {
      window.scrollTo({
          top: document.body.scrollHeight,
          behavior: 'smooth'
      });
  };