This is a migrated thread and some comments may be shown as answers.

Change slider 's colors

5 Answers 390 Views
Slider
This is a migrated thread and some comments may be shown as answers.
stephane
Top achievements
Rank 1
stephane asked on 17 Jun 2014, 10:05 AM
I would like to change colors in my slider.

I found that i could change the color of the selected area thanks to css class k-slider-selection
.k-slider-selection {
           background-color: #059BD8;
  }


Now i would like to do same for the "ball" shape selector  and the not selected area.

Could you help me please?

5 Answers, 1 is accepted

Sort by
0
Iliana Nikolova
Telerik team
answered on 17 Jun 2014, 11:38 AM
Hi Stephane,

You can change the slider draghandle background via the following CSS rule: 
.k-slider .k-draghandle {
    background-color: green; /* specify the background */
}
Another option is to use Kendo UI Web ThemeBuilder.

Regards,
Iliana Nikolova
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
stephane
Top achievements
Rank 1
answered on 17 Jun 2014, 12:01 PM
thank for answer Iliana but unfortunately that css rule doe not change anything

i put that css code 

.k-slider-selection {
           background-color: #059BD8;
       }
 
   .k-slider .k-draghandle {
           background-color: green;
    }
 and as you can see in attached file, it changes nothing for draghandle color (but work for selected area)

Theme builder seems great but slider  (and few others controls) keeps always the same look in spite of I change theme
0
stephane
Top achievements
Rank 1
answered on 17 Jun 2014, 12:33 PM
Sorry for my last observation,  Theme builder refresh has just a bug on chrome browser, but it works fine  on IE

But I still wonder why .k-draghandle alone does not have effect and which rules I have to combine with that rule for changing colors without paste the full  theme 
0
Accepted
Iliana Nikolova
Telerik team
answered on 19 Jun 2014, 07:09 AM
Hi Stephane,

I tested the suggested CSS rule and it is applied as expected (example). Could you please modify my example and demonstrate your current implementation - this way I would be able to advice you further and provide concrete recommendations? Thank you in advance for your cooperation.

Regards,
Iliana Nikolova
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
stephane
Top achievements
Rank 1
answered on 27 Jun 2014, 01:00 PM
I tried your sample in my project and it works.

Maybe I tried too much to make crazy wizard in my previous project and it broke style.

Thanks!
Tags
Slider
Asked by
stephane
Top achievements
Rank 1
Answers by
Iliana Nikolova
Telerik team
stephane
Top achievements
Rank 1
Share this question
or