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. 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
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top