customizing Slider with different slider image?

2 posts, 0 answers
  1. Himanshu Thakur
    Himanshu Thakur avatar
    11 posts
    Member since:
    Nov 2009

    Posted 21 Dec 2009 Link to this post


    Just wondering if there is any way with which I can change the sliders with the icons of my choice?
    With slider I mean the pointer of the slider, so that i can replace the default pointers with the image of my choice and then that replaced image should act as the pointer/pointers for the slider.

    Ideas? :)
  2. Martin
    Martin avatar
    585 posts

    Posted 22 Dec 2009 Link to this post

    Hi Himanshu Thakur,

    RadSlider's skinning is made-up of CSS and this allows any styling that you need by creating a custom skin for the control. Here are the basic steps to use RadSlider with an external skin:

    1. Select a skin that you will use as a base for your new one, and copy it in your project, for example - our Default skin. All uncompiled skins that RadControls are shipped with are included in [RadControls]/Skins/, so you need the following files:

     - [RadControls]/Skins/Default/Slider.Default.css - the stylesheet of the skin
     - [RadControls]/Skins/Default/Slider/ - the images of the skin

    2. Set EnableEmbeddedSkins="false" in the server declaration of the control
    3. Set Skin="Default" in the server declaration of the control
    4. Register Slider.Default.css in the head section of your page by using the <link /> tag and make sure that the path to the file is correct
    5. Reload the page and make sure the ski is applied
    6. Modify the CSS and the images according to your new design, i.e. this is the steps where you create your custom skin

    Martin Ivanov
    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.
Back to Top