Page 1 of 1

Designing scroll bar

Posted: Wed Mar 31, 2021 10:40 am
by 4ctive
Hi Hopki,
Hi Everybody,

I am wondering if there is an option to style the scroll bar's in the "draw scroll area" element? I am looking for implementing things like that:
/* width */
::-webkit-scrollbar {
width: 20px;
}

/* Track */
::-webkit-scrollbar-track {
box-shadow: inset 0 0 5px grey;
border-radius: 10px;

Thanks all in advance for your help!

BR,
Benjamin

Re: Designing scroll bar

Posted: Wed Mar 31, 2021 11:52 am
by Hopki
Hi Benjamin,
The track width is already in the scroll area element.

Screenshot 2021-03-31 at 10.51.00.png
Screenshot 2021-03-31 at 10.51.00.png (36.68 KiB) Viewed 1632 times

The other settings may be able to be applied to the CSS of the element but have not tried.
Regards,

Re: Designing scroll bar

Posted: Wed Mar 31, 2021 2:08 pm
by 4ctive
Thanks Hopki.
I have already tried to implement it in the CSS of the element, but unfortunately did not get it to work.

Also, do you know if there is a possibility to implement a button (one at the beginning and one at the end) for scrolling instead of the bar?

Re: Designing scroll bar

Posted: Wed Mar 31, 2021 3:00 pm
by 4ctive
OK, I found that out myself. That's working quite well!

What I could not figure out: I would like to only see this button if the scroll bar is visible (set to "auto"). So I do not want the button to be visible if there is nothing to scroll. Is there a way to do this?