.Net Gridview restoring alternating color after mouseover

I have a gridview with the alternatingRowStyle property set.

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
        DataSourceID="SqlDataSource2" O开发者_JS百科nRowDataBound="GridView1_RowDataBound"
        onselectedindexchanged="GridView1_SelectedIndexChanged" AlternatingRowStyle-BackColor="#f0f1f3">

I also want to highlight rows as the cursor moves over with this:

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)  
{  
        if (e.Row.RowType == DataControlRowType.DataRow)  
        {  
            e.Row.Attributes.Add("onmouseover", "this.style.backgroundColor='#ceedfc'");  
            e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=''");  
            e.Row.Attributes.Add("style", "cursor:pointer;");

The problem I'm having is that when the mouse moves past the row, it is being restored to white, not the previous color, which is different in half the rows. I supposed I could save the current rowcolor before replacing it for each "onmouseove" event, but that seems expensive and worrisome if fast mouse movement could mess things up.

I don't see a property for gridview rows to tell me if it is alternate row but would a simple odd/even determination on the rowindex be best here?

Any better suggestions?

Thanks.

-Dan

Store the original style. Then set the styles backgroundColor to this.originalstyle.

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)  
{  
        if (e.Row.RowType == DataControlRowType.DataRow)  
        {  
            e.Row.Attributes.Add("onmouseover", "this.originalstyle=this.style.backgroundColor;this.style.backgroundColor='#ceedfc'");  
            e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=this.originalstyle");  
            e.Row.Attributes.Add("style", "cursor:pointer;");

I prefer using CSS for hover color

tr.odd {
  background-color: White;
}
tr.even {
  background-color: #f8f8f8;
}
tr.odd:hover {
  background-color: #f3fcfa;
}
tr.even:hover {
  background-color: #ebf3f1;
}

Using JQuery:

$(document).ready(function ()
{
    var original = "";

    $("#<%=yourGridViewNameHere.ClientID%> tr:has(td)").hover(function ()
    {
        original = $(this).css("background-color");

        $(this).css("background-color", "Pink");
    }, function ()
    {
        $(this).css("background-color", original);
    });
});

The original answer I got from here, I just tweaked it a bit for my needs as seen above.

Enjoy