Change images of ListBox button

4 posts, 0 answers
  1. Anna Wodinszky
    Anna Wodinszky avatar
    1 posts
    Member since:
    Apr 2010

    Posted 06 May 2010 Link to this post

    Hi!

    I would like to change the images of the  listbox's buttons. Where can i do this?
    Can i set these changes like : onmousedown, onmouseoves etc.?

    Thank you
  2. Veronica
    Admin
    Veronica avatar
    1213 posts

    Posted 11 May 2010 Link to this post

    Hello Anna Wodinszky,

    Currently, RadListBox does not provide this functionality out-of-the-box. However, you can change images on onmouseover or onmousedown but you'll have to use different CSS classes for this.

    The only customization of the buttons available for now is that you can display text next to the image by setting the RenderButtonText property to true. You may find demo about this here.


    Regards,
    Veronica Milcheva
    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
  4. niv kfir
    niv kfir avatar
    21 posts
    Member since:
    Apr 2010

    Posted 24 Jun 2012 Link to this post

    I see this post is from 2010.
    Is there any progress with customizing the image of a radListBox buttons?

    Thanks,
    Niv.

  5. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 27 Jun 2012 Link to this post

    Hi Niv,

    I have already answered your question in the support ticket that you sent us but I will paste my answer here as well in case anyone else needs it:

    With the Default skin of the RadListBox control you can use the following css class selector in order to alter the appearance (the background image that is currently applied) of the transfer buttons:
    div.RadListBox_Default .rlbButton .rlbButtonTL,
    div.RadListBox_Default .rlbButton .rlbButtonTR,
    div.RadListBox_Default .rlbButton .rlbButtonBL,
    div.RadListBox_Default .rlbButton .rlbButtonBR,
    div.RadListBox_Default .rlbDisabled:hover .rlbButtonTL,
    div.RadListBox_Default .rlbDisabled:hover .rlbButtonTR,
    div.RadListBox_Default .rlbDisabled:hover .rlbButtonBL,
    div.RadListBox_Default .rlbDisabled:hover .rlbButtonBR
     {
        background-image: url("ListBox/rlbButtonNormal.png");
    }

    I would also suggest that you refer to the following help article for more information on the different css classes that are applied to the control:
    http://www.telerik.com/help/aspnet-ajax/listbox-css-skin-file-selector.html

    You can also find the attached images needed for the hover and normal state of the transfer buttons of the RadListBox control.

    Regards,
    Kate
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top