Search code examples
asp.netonmouseoveronmouseout

Onmouseover Hand icon not displaying


I have a gridview:

    <asp:GridView ID="gvwProd" runat="server" CssClass="gridview" ShowHeaderWhenEmpty="true"
                                        AllowPaging="true" BackColor="ButtonFace" OnRowDataBound="gvwProd_OnRowDataBound"
                                        OnRowCreated="gvwProd_RowCreated" OnSorting="gvw_OnSorting" AllowSorting="true"
                                        AutoGenerateColumns="false" ShowFooter="false">

I'm trying to set a hand hover icon for a specific cell on each row:

protected void gvwProd_OnRowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        e.Row.Cells[2].Attributes.Add("onmouseover", "document.body.style.cursor='hand'");
        e.Row.Cells[2].Attributes.Add("onmouseout", "document.body.style.cursor='auto'");
    }
}

The onmousover and onmouseout events appear in the markup:

    <td onmouseover="document.body.style.cursor=&#39;hand&#39;" onmouseout="document.body.style.cursor=&#39;auto&#39;" style="white-space:nowrap;">05-07-2012</td>

However, there is no visible trace of the hand and nothing appears to be happening. What am I doing wrong? Using IE 8


Solution

  • First: Use cursor: pointer not cursor: hand (if you want that it works in more than one browser)

    Second: Instead of using document.body i would use this:

    e.Row.Cells[2].Attributes.Add("onmouseover", "this.style.cursor='pointer'");
    

    since you want the cursor onmouseover of the cell.