I'd like to change the color of the draghandle for each of my slider controls individually. I'll set a color initially server-side and then dynamically client-side. Would someone point me to samples and/or a write-up on how to do this, please? I have several of them in a user control. I'll be using the Outlook skin.
Thanks,
Frank
Thanks,
Frank
4 Answers, 1 is accepted
0
Hello Frank,
I am not quite sure what you mean by saying that you want to change the color of the dragHandle of a RadSlider. The dragHandle is actually an image and in case you just want to change the color of that image, you will have to create another image with the necessary color. You can apply this image using the CssClass property of the RadSlider control on the server. For example:
Additionally, you can get a reference to the dragHandle HTML element on the client and set its background-image as inline style the following way:
Regards,
Tsvetie
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
I am not quite sure what you mean by saying that you want to change the color of the dragHandle of a RadSlider. The dragHandle is actually an image and in case you just want to change the color of that image, you will have to create another image with the necessary color. You can apply this image using the CssClass property of the RadSlider control on the server. For example:
protected void Page_Load(object sender, EventArgs e){ RadSlider1.CssClass = "CustomDragHandle";}<head id="Head1" runat="server"> <title></title> <style type="text/css"> .CustomDragHandle .rslHorizontal .rslTrack a.rslDraghandle { background: url("MyCustomImage.gif") no-repeat 0 0; } </style></head><body> <form id="Form1" method="post" runat="server"> <asp:ScriptManager ID="ScriptManager" runat="server" /> <telerik:RadSlider ID="RadSlider1" runat="server"> </telerik:RadSlider> </form></body>Additionally, you can get a reference to the dragHandle HTML element on the client and set its background-image as inline style the following way:
<telerik:RadSlider ID="RadSlider1" runat="server" OnClientValueChange="ChangeDragHandleImage"></telerik:RadSlider><script type="text/javascript">function ChangeDragHandleImage(sender, args){ if(sender.get_value() > 50) { var dragHandle = sender.get_dragHandles()[0]; dragHandle.style.background = 'url("MyCustomImage.gif") no-repeat 0 0'; } }</script>Regards,
Tsvetie
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Frank
Top achievements
Rank 1
Rank 1
answered on 12 Oct 2009, 12:57 PM
Thanks Tsvetie...
I thought it might have to do with changing the draghandle image. In any case, your examples will be a great help.
Frank
I thought it might have to do with changing the draghandle image. In any case, your examples will be a great help.
Frank
0
vinod nagda
Top achievements
Rank 1
Rank 1
answered on 09 Jul 2010, 05:11 PM
Hello Friends,
I am working in Wpf Application in C#.net.
and i have some problem Regarding Radslider.
I want to change the image of Radslider dragHandle and apply volumecontrol.png
Image for DragHandle of RadSlider which i have sent to you.
Please Help Me
Thanks In advance
Vinod
I am working in Wpf Application in C#.net.
and i have some problem Regarding Radslider.
I want to change the image of Radslider dragHandle and apply volumecontrol.png
Image for DragHandle of RadSlider which i have sent to you.
Please Help Me
Thanks In advance
Vinod
0
Hello Vinod,
I assume you have in mind RadSlider for WPF. If so, I've prepared a small project that shows how to replace the original handle with your custom one. Additionally, I'd suggest you have a look at this article, as it explains how to modify the look and feel of our controls.
Best wishes,
Kiril Stanoev
the Telerik team
I assume you have in mind RadSlider for WPF. If so, I've prepared a small project that shows how to replace the original handle with your custom one. Additionally, I'd suggest you have a look at this article, as it explains how to modify the look and feel of our controls.
Best wishes,
Kiril Stanoev
the Telerik team
Do you want to have your say when we set our development plans?
Do you want to know when a feature you care about is added or when a bug fixed?
Explore the
Telerik Public Issue Tracking
system and vote to affect the priority of the items