Introduction:In this article i will explain the way to highlight GridView's row on mouse over i.e. when you move cursor over any GridView row it will get highlighted.It also looks attractive and give your application a new innovative look. There are many other ways to do this but using easiest and the optimized way is to use CSS class.
In previous articles i explained Show tool tip message using CSS and HTML and Bind gridview and highlight row on mouse over in asp.net and Bind,Save,Edit,Update,Cancel,Delete,Paging example in GridView in asp.net C# and Bind,upload,download,delete image files from the gridview and Sorting in gridview by column header and Searching records in gridview records
Implementation: let's create a web page to see it in action.
In previous articles i explained Show tool tip message using CSS and HTML and Bind gridview and highlight row on mouse over in asp.net and Bind,Save,Edit,Update,Cancel,Delete,Paging example in GridView in asp.net C# and Bind,upload,download,delete image files from the gridview and Sorting in gridview by column header and Searching records in gridview records
Implementation: let's create a web page to see it in action.
- In the <head> tag of the asp.net design page(.aspx) write as:
<head runat="server">
<style type="text/css">
#grdEmp tr.rowHover:hover
{
background-color:#cccccc;
}
</style>
</head>
- Now place a gridview data control on the design page(.aspx) and write as:
<asp:GridView ID="grdEmp" runat="server CssClass="rowHover" RowStyle-CssClass="rowHover">
</asp:GridView>
Note: You just need to call the class "rowHover" in CssClass and RowStyle-CssClass
Note: You just need to call the class "rowHover" in CssClass and RowStyle-CssClass
Now over to you:
" I hope you have got the easiest CSS trick to highlight gridview row on mouse over in asp.net and
If you like my work; you can appreciate by leaving your comments, hitting
Facebook like button, following on Google+, Twitter, Linked in and Pinterest,
stumbling my posts on stumble upon and subscribing for receiving free updates
directly to your inbox . Stay tuned and stay connected for more technical
updates."
2 comments
Click here for commentswht if i have to implement this code in a content page which is been linked to its master page
ReplyIf you have any question about any post, Feel free to ask.You can simply drop a comment below post or contact via Contact Us form. Your feedback and suggestions will be highly appreciated. Also try to leave comments from your account not from the anonymous account so that i can respond to you easily..