Change Horizontal SelectedRegion image using Javascript and CSS

2 posts, 0 answers
  1. Pradyumna
    Pradyumna avatar
    4 posts
    Member since:
    Oct 2010

    Posted 21 Oct 2010 Link to this post

    Hi,

    I would like to change the horizontal selected region image of a slider control on the clientside. I have set to false the EnableEmbeddedSkins property and included a css skin file for the slider control. I see the following class in the css file

    .rslHorizontal .rslSelectedregion
    {
        background:url(../images/Slider/SelectedRegionHorizontalBgr.gif) right top no-repeat;
    }
     But I want to change the image path on a button click.

    Any help is appreciated.
  2.
  3. Tsvetie
    Admin
    Tsvetie avatar
    1517 posts

    Posted 27 Oct 2010 Link to this post

    Hello Pradyumna,
    You can get a reference to the selected region element and change its background image the following way:
    <telerik:RadSlider ID="RadSlider1" runat="server" Value="50">
    </telerik:RadSlider>
    <button onclick="ChangeBackgroundImage();return false;">
        Change</button>
    <script type="text/javascript">
        function ChangeBackgroundImage()
        {
            var selectedRegion = $get("RadSliderSelected_<%= RadSlider1.ClientID %>");
            selectedRegion.style.backgroundImage = "url('...')";
        }
    </script>

    Sincerely yours,
    Tsvetie
    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
Back to Top