Change color of button on hover

4 posts, 0 answers
  1. Clive Hoggar
    Clive Hoggar avatar
    334 posts
    Member since:
    Nov 2008

    Posted 05 Jan 2011 Link to this post

    Hi

    I am trying to modify slightly the color of the button on hover when using the form decorator with 'Hay' skin.
    Tried a css file technique (see below) that worked with an earlier version of the controls, but it doesn't work now (Q2 2010 release). 
    Can you tell me what I should be using instead?
    Thanks
    Clive
    a.RadForm_Hay:hover .rfdInner {color: #ACB936 !important;}
  2. Bozhidar
    Admin
    Bozhidar avatar
    680 posts

    Posted 05 Jan 2011 Link to this post

    Hello Clive,

    To change the hove color of the button in RadFromDecorator, you could use the following code:

    /* normal state color */
            .RadForm_Hay .rfdSkinnedButton .rfdDecorated
            {
                color: Red !important;
            }
             
            /* hover state color */
            .RadForm_Hay .rfdSkinnedButton:hover .rfdDecorated,
            .RadForm_Hay .rfdSkinnedButton .rfdDecorated:hover
            {
                color: Blue !important;
            }


    Regards,
    Bojo
    the Telerik team
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Clive Hoggar
    Clive Hoggar avatar
    334 posts
    Member since:
    Nov 2008

    Posted 07 Jan 2011 Link to this post

    Thanks Bojo

    I have implemented this, but it only seems to change the color of the TEXT of the button, rather than 
    the background color of the button itself.

    Is there something else I need to do. 

    Thanks

    Clive

    PS. For actual site see www.church-on-the-net.com search button at top right
  5. Bozhidar
    Admin
    Bozhidar avatar
    680 posts

    Posted 10 Jan 2011 Link to this post

    Hello Clive,

    Yes, it is correct, it changes only the button color. Unfortunately you cannot change the background color as it is released with images organized in a sprite image.

    To have different background color, it will be necessary to create your own RadFormDecorator custom skin.

    It could look scary and complicated, but all you need is to have Adobe Photoshop and the sprite image color will be changed in a minutes. That will allow you to set the background color you prefer.

    If you are using RadFormDecorator only to decorate your buttons, I would suggest you to use RadButton control. It is released in the same way and html rendering, it will be also necessary to Create RadButton custom skin in order to change the background color. However  RadButton control is really flexible and it allows you to use Link Buttons instead the default buttons, where you could change the background color just by using CSS. It also offers a set of embedded  icons, which you could insert into your button really easily.

    Greetings,
    Bojo
    the Telerik team
    Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
Back to Top