Javascript to work with the modalpopup with the gridview controls

Hi All, If we need to show the details of the grid view in a modalpopup on mouseover on the particular value, it will open a window with regarding details, i want show this detail on mouse over in ajax popup control. We need to use some JavaScript to achieve this with the grid view. See the below example. It will reduce the grid view load time also.

Java Script:

<script type="text/javascript">

    function getTop(e)

    {

        var offset=e.offsetTop;

        if(e.offsetParent!=null) offset+=getTop(e.offsetParent);

        return offset;

    }

    function getLeft(e)

    {

        var offset=e.offsetLeft;

        if(e.offsetParent!=null) offset+=getLeft(e.offsetParent);

        return offset;

    }

    function hideModalPopupViaClient()

    {

        var modalPopupBehavior = $find('ModalPopupExtender');

        modalPopupBehavior.hide();

    }

    function showModalPopupViaClient(control,id)

    {

        $get("inputBox").innerText="You choose the item "+control.innerHTML;

        var modalPopupBehavior = $find('ModalPopupExtender');

        modalPopupBehavior.show();          

        $get(modalPopupBehavior._PopupControlID).style.left=getLeft($get('<%=gvInvoice.ClientID %>'))+ $get('<%=gvInvoice.ClientID %>').offsetWidth+"px";

        $get(modalPopupBehavior._PopupControlID).style.top=getTop(control)+"px";

    }

</script>

Gridview:

  <asp:UpdatePanel ID="UpdatePanel1" runat="server">

        <ContentTemplate>       

        <asp:GridView ID="gvInvoice" runat="server" AutoGenerateColumns="False" OnRowCommand="gvInvoice_RowCommand" CellPadding="4" ForeColor="#333333" GridLines="None" OnRowDataBound="gvInvoice_RowDataBound">

            <Columns>

                <asp:TemplateField HeaderText="Quantity">

                    <EditItemTemplate>

                        <asp:TextBox ID="txtEColumn1" runat="server" Style="text-align: right;" Text='<%# Bind("Column1")%>'

                            Width="80px"></asp:TextBox>

                    </EditItemTemplate>

                    <ItemTemplate>

                        <asp:TextBox ID="txtIColumn1" runat="server" Style="text-align: right;" Text='<%# Bind("Column1")%>'

                            Width="80px"></asp:TextBox>

                    </ItemTemplate>

                    <FooterTemplate>

                        <asp:TextBox ID="txtFColumn1" runat="server" CausesValidation="True" Style="text-align: right;"

                            Visible="false" Width="80px"></asp:TextBox>

                    </FooterTemplate>

                </asp:TemplateField>

                <asp:TemplateField HeaderText="Cost Each">

                    <EditItemTemplate>

                        <asp:TextBox ID="txtEColumn2" runat="server" Style="text-align: right;" Text='<%# Bind("Column2")%>'

                            Width="80px"></asp:TextBox>

                    </EditItemTemplate>

                    <ItemTemplate>

                        <asp:TextBox ID="txtIColumn2" runat="server" Style="text-align: right;" Text='<%# Bind("Column2")%>'

                            Width="80px"></asp:TextBox>

                    </ItemTemplate>

                    <FooterTemplate>

                        <asp:TextBox ID="txtFColumn2" runat="server" CausesValidation="True" Style="text-align: right;"

                            Visible="false" Width="80px"></asp:TextBox>

                       

                    </FooterTemplate>

                </asp:TemplateField>

                <asp:TemplateField HeaderText="Amount">

                    <EditItemTemplate>

                        <asp:TextBox ID="txtEColumn3" runat="server" Style="text-align: right;" Text='<%# Bind("Column3")%>'

                            Width="80px"></asp:TextBox>

                    </EditItemTemplate>

                    <ItemTemplate>

                        <asp:TextBox ID="txtIColumn3" runat="server" Style="text-align: right;" Text='<%# Bind("Column3")%>'

                            Width="80px"></asp:TextBox>

                    </ItemTemplate>

                    <FooterTemplate>

                        <asp:TextBox ID="txtFColumn3" runat="server" CausesValidation="True" Style="text-align: right;"

                            Width="80px"></asp:TextBox>

                    </FooterTemplate>

                </asp:TemplateField>      

                <asp:TemplateField>

                    <ItemTemplate>    

                        <div style="border-color:Black;border-width:1px;border-style:solid;">

                            <asp:Label ID="Label1" Text='<%# Eval("Column1") %>' runat="server"></asp:Label> 

                            <asp:HyperLink ID="detail" runat="server" onmouseout="hideModalPopupViaClient()" onmouseover="showModalPopupViaClient(this)">'<%# Eval("Column1")%>'</asp:HyperLink>

                        </div> 

                    </ItemTemplate>

                </asp:TemplateField>                                                 

            </Columns>

        <RowStyle BackColor="#EFF3FB" />

        <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />

        <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />

        <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />

        <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />

        <EditRowStyle BackColor="#2461BF" />

        <AlternatingRowStyle BackColor="White" />

    </asp:GridView>

                                     

        </ContentTemplate>

    </asp:UpdatePanel>

        &nbsp;

    

   

        <asp:Button runat="server" ID="showModalPopupClientButton" style="display:none"/>

        <cc1:ModalPopupExtender ID="ModalPopupExtender" runat="server"

            TargetControlID="showModalPopupClientButton"

            PopupControlID="programmaticPopup"

            RepositionMode="None"

            />

        <br />

        <div CssClass="modalPopup" id="programmaticPopup" style="background-color:#EEEEEE;      filter:alpha(opacity=70);opacity:0.7;display:none;width:50px;padding:10px">

            <span id="inputBox" ></span>

           <br />