TOOLTIP ASP.NET JQUERY

Aquí voy a explicar cómo mostrar la información de una fila en un Tooltip al pasar el mouse por encima de la fila de un GridView  con jQuery utilizando asp.net en C #.
Las herramientas a utilizar son:

1. Descargar Tooltip.
2. Descargar Jquery.

Tooltip.aspx

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"

    CodeFile="ToolTip.aspx.cs" Inherits="ToolTip" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="Server">

    <script src="Scripts/jquery-1.8.2.js" type="text/javascript"></script>

    <script src="Scripts/jquery.tooltip.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        function InitializeToolTip() {

            $(".grilla").tooltip({

                track: true,

                delay: 0,

                showURL: false,

                fade: 100,

                bodyHandler: function () {

                    return $($(this).next().html());

                },

                showURL: false

            });

        }

    </script>

    <script type="text/javascript">

        $(function () {

            InitializeToolTip();

        })

    </script>

    <style type="text/css">

        #tooltip

        {

            position: absolute;

            z-index: 3000;

            border: 1px solid #111;

            background-color: #EB8621;

            padding: 5px;

            color:White;

            border-radius:10px;

            width:350px;

            border:0px;

            font-size:18px;

        }

        #tooltip h3, #tooltip div

        {

            margin: 0;

        }

    </style>

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">

    <asp:GridView ID="gvDatos" AutoGenerateColumns="False" CellPadding="3"

    runat="server"  BorderColor="#CCCCCC" BorderStyle="None"

    BorderWidth="1px" BackColor="White">

        <Columns>

            <asp:TemplateField HeaderText="codigo">

                <ItemStyle Width="30px" HorizontalAlign="Center" />

                <ItemTemplate>

                    <a href="#" class="grilla">

                        <%# Eval("codigo")%></a>

                    <div id="tooltip" style="display: none;">

                        <table>

                            <tr>

                                <td style="white-space: nowrap;">

                                    <b>Nombre:</b>&nbsp;

                                </td>

                                <td>

                                    <%# Eval("nombre")%>

                                </td>

                            </tr>

                            <tr>

                                <td style="white-space: nowrap;">

                                    <b>Colegio:</b>&nbsp;

                                </td>

                                <td>

                                    <%# Eval("colegio")%>

                                </td>

                            </tr>

                            <tr>

                                <td style="white-space: nowrap;">

                                    <b>Distrito:</b>&nbsp;

                                </td>

                                <td>

                                    <%# Eval("distrito")%>

                                </td>

                            </tr>

                        </table>

                    </div>

                </ItemTemplate>

            </asp:TemplateField>

            <asp:BoundField HeaderText="nombre" DataField="nombre" />

            <asp:BoundField HeaderText="colegio" DataField="colegio" />

            <asp:BoundField HeaderText="distrito" DataField="distrito" />

        </Columns>

        <FooterStyle BackColor="White" ForeColor="#000066" />

        <HeaderStyle  Font-Bold="true" ForeColor="White" BackColor="#FF7C01" />

        <PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />

        <RowStyle ForeColor="#000066" />

        <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />

        <SortedAscendingCellStyle BackColor="#F1F1F1" />

        <SortedAscendingHeaderStyle BackColor="#007DBB" />

        <SortedDescendingCellStyle BackColor="#CAC9C9" />

        <SortedDescendingHeaderStyle BackColor="#00547E" />

    </asp:GridView>

</asp:Content>

Tooltip.aspx.cs

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

using System.Data.SqlClient;

public partial class ToolTip : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

            mostrarGrilla();

        }

    }

    protected void mostrarGrilla()

    {

        DataTable dt = new DataTable();

        dt.Columns.Add("codigo", typeof(Int32));

        dt.Columns.Add("nombre", typeof(string));

        dt.Columns.Add("colegio", typeof(string));

        dt.Columns.Add("distrito", typeof(string));

        DataRow dtrow = dt.NewRow();    // Create New Row

        dtrow["codigo"] = 1;            //Bind Data to Columns

        dtrow["nombre"] = "Noé Leon Jacobo";

        dtrow["colegio"] = "Ramón Castilla";

        dtrow["distrito"] = "Los Olivos";

        dt.Rows.Add(dtrow);

        dtrow = dt.NewRow();               // Create New Row

        dtrow["codigo"] = 2;               //Bind Data to Columns

        dtrow["nombre"] = "Hugo Trigoso Paredes";

        dtrow["colegio"] = "Ate 254 ";

        dtrow["distrito"] = "Ate";

        dt.Rows.Add(dtrow);

        dtrow = dt.NewRow();              // Create New Row

        dtrow["codigo"] = 3;              //Bind Data to Columns

        dtrow["nombre"] = "Wilfredo Torres";

        dtrow["colegio"] = "Arevalos 343";

        dtrow["distrito"] = "La Molina";

        dt.Rows.Add(dtrow);

        gvDatos.DataSource = dt;

        gvDatos.DataBind();

    }

}

Resultado Final