Fixed headers in gridview using small javascript

IN aspx page


 <div id="DivRoot" align="left">
                            <div style="overflow: hidden;" id="DivHeaderRow">
                            </div>
                            <div style="overflow: auto;" onscroll="OnScrollDiv(this)" id="DivMainContent">
                           
                                <asp:GridView ID="gvAuditLogDetails" runat="server" EmptyDataText="No Records" HeaderStyle-BackColor="Red" HeaderStyle-ForeColor="White" CssClass="table" RowStyle-Height="20px" Width="1323px" HeaderStyle-Height="10px" >                                
                                </asp:GridView>                            
                            </div>
                        </div>


=>for javascript code:
................................................


  <script type="text/javascript">
        function MakeStaticHeader(gridId, height, width, headerHeight, isFooter) {
            var tbl = document.getElementById(gridId);
            if (tbl) {
                var DivHR = document.getElementById('DivHeaderRow');
                var DivMC = document.getElementById('DivMainContent');

                //*** Set divheaderRow Properties ****
                DivHR.style.height = headerHeight + 'px';
                DivHR.style.width = (parseInt(width) - 10) + 'px';
                DivHR.style.position = 'relative';
                DivHR.style.top = '0px';
                DivHR.style.zIndex = '10';
                DivHR.style.verticalAlign = 'top';

                // DivHR.firstElementChild.scrollIntoView = 'none'
                //*** Set divMainContent Properties ****
                DivMC.style.width = width + 'px';
                DivMC.style.height = height + 'px';
                DivMC.style.position = 'relative';
                DivMC.style.top = -headerHeight + 'px';
                DivMC.style.zIndex = '0';

                //****Copy Header in divHeaderRow****
                DivHR.appendChild(tbl.cloneNode(true));
            }
            setEmpCode('1');
        }
        function OnScrollDiv(Scrollablediv) {
            document.getElementById('DivHeaderRow').scrollLeft = Scrollablediv.scrollLeft;
            // document.getElementById('DivFooterRow').scrollLeft = Scrollablediv.scrollLeft;
        }
    </script>



This script can call on page load/code behind
...........................................................................................

  ScriptManager.RegisterStartupScript(Page, this.GetType(), "Key", "<script>MakeStaticHeader('" + gvAuditLogDetails.ClientID + "', 510 ,1350, 20 ,true); </script>", false);
                           Gridview name , Height, width, HeaderHeight, isFooter