Menu
Sites
Language
Wearable scroll bar component – how to customize scroll bar?

Hello,

I am using the Tizen Wearable UI Components and im wondering if there is any way to customize the look of the scroll bar that appears on the right side of content.

To be clear, this one:

http://imgur.com/lRBwAI7

How would you change its color? how about making it wider?

 

List

Responses

9 Replies
AVSukhov

Hello,

Try to use "::-webkit-scrollbar" property:

https://css-tricks.com/examples/WebKitScrollbars/

Palitsyna

Hello,

here you can find more detailed information about styling sscrollbars using "::-webkit-scrollbar" property: https://www.webkit.org/blog/363/styling-scrollbars/

And here you can find many different examples: http://cssdeck.com/labs/css3-webkit-vertical-scrollbars/

Juan Ospina

Im sorry but those properties don't actually work for the circular scrollbar. They work only on the regular scrollbar.

Does anybody know how to style the CIRCULAR scrollbar for wearable devices? (such as Samsung gear S2)

colin Rao

try to apply the -webkit-scrollbar property on the body tag.

AVSukhov

Hello,

I hope that support for -webkit-scrollbar will be added in next release. 

Is obtained that currently there is no ways to customize scrool bar.

Vitorio Kuroda

Almost 3 years and still not possible to customize the circular scrollbar for tizen web applications for wearables.

new_to_tizen

Hi Vitorio,

any luck with this..?

I am struggling already for weeks and cannot figure it out how to change the color. It's absurd!

Cheers,

Jerzy

K Johnson

How about trying to override circular CSS style? Please have a look into the Overriding the Circular CSS Style with a Media Query section in this link.

new_to_tizen

Hi Juan,

any luck with this..?

I am struggling already for weeks and cannot figure it out how to change the color. It's absurd!

Cheers!