search

yairEO / fakescroll

vanilla-js lightweight custom HTML scrollbar
http://yaireo.github.io/fakescroll
GNU Affero General Public License v3.0
365 stars 33 forks source link

Give the .fakeScroll__track div a class when there is nothing to scroll #17

Closed ataylor32 closed 4 years ago

ataylor32 commented 4 years ago

When no scrolling is necessary, the .fakeScroll__bar div is hidden with display: none. This is good, but I think it would also be good if the .fakeScroll__track div was given a class like .fakeScroll__has_hidden_bar or something along those lines so that developers could more easily update the styling of the track when there is nothing to scroll.

yairEO commented 4 years ago

Good idea, thanks!

ataylor32 commented 4 years ago

Do you know when this might be added? Is there anything I can do to help?

yairEO commented 4 years ago

Hi I am spending all day to port my code to React and once it's done I'll release it along with the change you've requested (hopefully today but I'm currently facing one last tough bug with the React port)

yairEO commented 4 years ago

Done. update to v2.2.0, see docs for DOM structure.

ataylor32 commented 4 years ago

Thanks! In order to get this working properly on my project, I had to remove the following from onScrollResize:

this.DOM.scope.classList.toggle('fakeScroll--hasBar', this.state.scrollRatio < 1)

I then added the following to moveBar at the same point where this.DOM.bar.style.cssText gets set:

if (scrollHeight <= ownHeight) {
    this.DOM.scope.classList.remove('fakeScroll--hasBar');
}
else {
    this.DOM.scope.classList.add('fakeScroll--hasBar');
}
yairEO commented 4 years ago

Why did you remove it? moveBar is not the place for it.

You should not change the source code or you'll be out-of-sync with future updates...

ataylor32 commented 4 years ago

You can look at #18 for context. I couldn't get that to work correctly without the change I mentioned in my previous comment. moveBar seemed like an appropriate place for it because that's where the .fakeScroll__bar div gets display: none added or removed.