Customizing kendo UI rangeSlider handle

Question

I am trying to use an image for the rangeSlider left and right handle. I noticed that the both of these handles are of anchor element of class k-draghandle and I am adding an child image element to it by dom manipulation.

Is there an easier way to customize the these handles?

Answer 1

The easiest way is just to add your own stylesheet that overrides the k-draghandle. Eg:

.k-slider .k-draghandle {
  background-image: url('data:image/gif;base64,R0lGODlhCwAbAJEAAMzMzJmZmQAAAAAAACwAAAAACwAbAAACMYyPBsus3R5cclZ4Y2Ciuz1RINAJXyhyXopK5dmOLxu6K5DB5J3T1vhD4YAYoiaRKAAAOwAA');
}

(its not pretty, but you get the idea)