How can I use button's hover style?

2 posts, 0 answers
  1. tomekm
    tomekm avatar
    38 posts
    Member since:
    Mar 2009

    Posted 01 Jul 2011 Link to this post

    I use FormDecorator to style buttons in my application with Office2007 skin. I especially like effect that hovered buttons have. Can I set in code behind that not-hovered button will look like hovered somehow?
  2. Bozhidar
    Admin
    Bozhidar avatar
    677 posts

    Posted 04 Jul 2011 Link to this post

    Hello Rychu,

    You could not do that through the code behind, but you should create some custom CSS that will force the normal state button to use the hover states background positions:

    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head id="Head1" runat="server">
        <title></title>
        <style type="text/css">
            .RadForm_Office2007.rfdButton input[type="button"].rfdDecorated,
            .RadForm_Office2007.rfdButton input[type="reset"].rfdDecorated,
            .RadForm_Office2007.rfdButton input[type="submit"].rfdDecorated,
            .RadForm_Office2007.rfdButton .rfdSkinnedButton button,
            .RadForm_Office2007.rfdButton a.rfdInputDisabled.rfdSkinnedButton:hover *
            {
                background-position: left -66px;
            }
             
            .RadForm_Office2007.rfdButton a.rfdSkinnedButton,
            .RadForm_Office2007.rfdButton a.rfdInputDisabled.rfdSkinnedButton:hover
            {
                 background-position: right -44px;
            }
             
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="rs1" runat="server">
        </asp:ScriptManager>
        <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All"
            Skin="Office2007" />
        <asp:Button ID="btn1" runat="server" Text="Button" />
        </form>
    </body>
    </html>

    Best wishes,
    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
Back to Top