< telerik:GridEditCommandColumn/> and <telerik:GridButtonColumn> imagebutton hover

When i change the styles for Telerik, i want the imagebutton used in < telerik:GridEditCommandColumn/> and <telerik:GridButtonColumn>  display different image when mouse hover it. i didn't know where is a property that i can set to show an alternative image when i hover over a GridButtonColumn cotrol item and the ButtonType is set to imageButton. So i find a way from internet:

aspx:

<telerik:RadGrid runat="server" ID="gvData" onitemdatabound="gvData_OnRowDataBound" >

   <telerik:GridEditCommandColumn  ButtonType="ImageButton" UniqueName="ibtnEdit" EditImageUrl="~/Images/grid_edit.png" ></telerik:GridEditCommandColumn>
      <telerik:GridButtonColumn ButtonType="ImageButton" ImageUrl="~/Images/grid_delete.png" UniqueName="ibtnDelete"  CommandName="Delete" Text="Delete" ConfirmText="Are you sure you want to delete this record?" ConfirmDialogType="RadWindow" ConfirmTitle="Delete" />

</telerik:RadGrid>

 

C#:

  protected void gvData_OnRowDataBound(object source, Telerik.Web.UI.GridItemEventArgs e)

{

   if (e.Item is GridDataItem)
   {
    GridDataItem gditem = (GridDataItem)e.Item;
    ImageButton ibtnDelete = (ImageButton)gditem["ibtnDelete"].Controls[0];
    ibtnDelete.Attributes.Add("onmouseover", "this.src=\"" + ResolveUrl("~/Images/delete_hover.png") + "\"");
    ibtnDelete.Attributes.Add("onmouseout", "this.src=\"" + ResolveUrl("~/Images/delete.png") + "\"");
    ImageButton ibtnEdit = (ImageButton)gditem["ibtnEdit"].Controls[0];
    ibtnEdit.Attributes.Add("onmouseover", "this.src=\"" + ResolveUrl("~/Images/edit_hover.png") + "\"");
    ibtnEdit.Attributes.Add("onmouseout", "this.src=\"" + ResolveUrl("~/Images/edit.png") + "\"");
   }

}

it can work.