Slider Skinning Sample

[Rene]

Just a sample to skin a slider via css, thought I'd share:
(vendor prefixes omitted for clarity)


.k-slider-track {
    background: linear-gradient(to bottom, rgba(199, 199, 199, 0.7) 5%, rgba(156, 156, 156, 0.1) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #292929;
    border-radius: 2px;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5) inset;
}

.k-slider-selection {
    background: linear-gradient(to bottom, rgba(199, 244, 199, 0.7) 5%, rgba(156, 224, 156, 0.1) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-color: #293329;
    border-radius: 2px;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5) inset;
}

.k-draghandle {
  background: linear-gradient(to bottom, rgba(199, 244, 199, 0.7) 5%, rgba(156, 224, 156, 0.1) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
  border-color: #294429;
  border-radius: 2px;  
}

.k-tick-large {
  display:none;  
}

[Iliana Dyankova]

Hi Rene,

Thank you for sharing your solution with the community.

Regards,
Iliana Nikolova
Telerik