vue-chat-scroll icon indicating copy to clipboard operation
vue-chat-scroll copied to clipboard

Scroll to bottom when container resized

Open SupertigerDev opened this issue 5 years ago • 10 comments

Describe the bug When the window is resized, scroll does not stick at the bottom

To Reproduce Steps to reproduce the behavior:

  1. resize window

Expected behavior Content Scroll should stick at the bottom

SupertigerDev avatar Sep 11 '20 08:09 SupertigerDev

This will be fixed with version 2 since we'll be using a ResizeObserver! See #72.

theomessin avatar Sep 20 '20 00:09 theomessin

Epic thanks!

SupertigerDev avatar Sep 20 '20 06:09 SupertigerDev

I was wrong - I don't think a resize observer will fix this. The problem arises when the chat container height is relative - otherwise the scroll position should remain where it should.

We can code around this by listening to a window resize event and scrolling then. Let's leave this open and see what other people think.

theomessin avatar Sep 20 '20 11:09 theomessin

This issue is still valid, on resize it should stick to bottom

IAmShafqatAli avatar Jan 19 '21 12:01 IAmShafqatAli

which browser and os?

SupertigerDev avatar Jan 19 '21 18:01 SupertigerDev

@supertiger1234 Resize issue is in chrome and FF windows 10

IAmShafqatAli avatar Jan 20 '21 10:01 IAmShafqatAli

Oh wait, I thought this was one of my projects. Oops 😂

SupertigerDev avatar Jan 20 '21 12:01 SupertigerDev

No worries at all :)

Well, do you have any idea how can I solve the this problem ? I wrote as help wanted yesterday but I couldn't find anything that can solve issue, I wrote yesterday this text below.

Thank you so much for the work that you have done to create this package, it made my life easier :) However there is one thing that I am still cannot manage to do, that is if in chat window I scrolled in the middle of container and I sent the message, it doesn't scroll to bottom (perfect and expected behavior) but I would like to make a button that can help me scroll bottom and there is no event in this package that tells me that scroll to bottom is not achieved, i.e (v-chat-scroll-top-reached ) is the event if div top is reached. What if there is an event that can tell that in is somewhere in middle neither top or bottom, I can then use that event to show scroll to bottom button.

I there are a lot of work around for that, in JS but any suggestion from your side in this package will be highly appreciated.```

IAmShafqatAli avatar Jan 20 '21 13:01 IAmShafqatAli

I'm not sure. I just didn't use this lib and just manually scrolled to the bottom when required

SupertigerDev avatar Jan 20 '21 13:01 SupertigerDev

Guys this is an open-source project. I don't actually use this package anymore, I just maintain it. I've got other stuff going on and this is pretty much at the bottom of my priority list. Feel free to submit a pull request if you feel like helping. Otherwise, you'll just have to wait until I do all the other things I have to do before I get to this.

theomessin avatar Jan 20 '21 16:01 theomessin