-
Notifications
You must be signed in to change notification settings - Fork 77
Minimum scrollbar height #11
Comments
Hey @aeharding, I'm really happy that you find Vuebar useful 😃 This actually is kinda important feature/improvement. I'll get to it as soon as possible for me. Thanks |
Thanks for the your work at first!
|
Hey @nickensoul, thanks for the feedback =) When I get to implementing min height of scrollbar then I'll include As for second point - I assume you want to create a full height "pane" along which the dragger is moving? If yes, then I also have plans to add a new parent element to |
To introduce minimum height and maxium height I'll need to rewrite some mouse tracking code and it's no that trivial actually to make it perform well. That's why these features will be introduced in the 2.0 version of Vuebar some time in future. |
Just apply a min-height to your css...
I had the same problem on large divs, and this is currently working for me. |
@Bowens20832 that approach had some problems the last I've tested it. I think the scrollbar wasn't completely "touching" bottom of the scrollable container - like it would normally do. But... I'm working on 2.0 version of Vuebar. And some of you that are more curageous can already try to use the development version of it: https://github.com/DominikSerafin/vuebar/tree/development Lots of demos in docs/demotests.html It has proper support for min and max height of scrollbars and generally works alright. |
Please see my codes :) |
@jhlee8804 It generally works quite ok, however bar doesn't move right away from the top, when it is small (long content, short view). |
@mateuszlewko Thanks your feedback. I fixed it :) |
Hi @DominikSerafin, |
@trandaison the situation haven't changed from my last comment: #11 (comment) |
The @jhlee8804 solution has a slight error. When the bar is dragged from top to bottom and vice versa. Then the scrollTop property has the wrong height. Because there is no reset condition in the computeScrollTop() function. function computeScrollTop(el){
var state = getState(el);
var multiplier = state.el2.scrollHeight/state.el2.clientHeight;
state.scrollTop = state.barTop * multiplier;
var barHeight = state.el2.clientHeight * state.visibleArea;
if (barHeight < state.config.barMinHeight) {
var restOfScrollBarHeight = (state.config.barMinHeight - barHeight) * multiplier;
state.scrollTop += restOfScrollBarHeight;
if (state.scrollTop <= restOfScrollBarHeight) {
state.scrollTop = 0;
}
}
} It works for me, I tested on content from 1.500px to 60.000px |
Hi there!
Love this project. The scrollbars work quite well!
I have one question in a new scroll area I'm trying to implement scrollbars in.
The scroll area is small, but the scroll content is large. The scroll bar is only 2px tall. (Note: Mac's native scrollbar has this "min scrollbar height" feature and it is ~20px tall in my situation.)
Would it be possible to make the scrollbar have a minimum height (maybe up to 1/2 the scroll area height so you can still scroll if the scroll container is really small for some reason).
I started tinkering with the scrollbar height compute function, and it works, but the scrollTop isn't computed properly. Any help would be greatly appreciated. 😀
Thanks
Alex
The text was updated successfully, but these errors were encountered: