fixes

1) Add reference System.Web.Extensions to get rid of Update panel annoying errors.
2) Use
	function pageLoad() {
		//code goes here
	}
for JS with UpdatePanel

3)
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.js"></script>
<script type="text/javascript">
    function pageLoad() {
        // Code to copy the gridview header with style
        var gridHeader = $('#<%= GridView1.ClientID%>').clone(true).attr('id', 'clonedGrid');
        //Code to remove all rows except the header row
        $(gridHeader).find("tr:gt(0)").remove();
        $('#<%= GridView1.ClientID%> tr th').each(function (i) {
            //Dealing with annoyinng JQuery's Chrome bug
            var headerWidth = $(this).width();
            var isChrome = !!window.chrome && !!window.chrome.webstore;
            if (isChrome) {
                headerWidth += parseInt($(this).css('border-left-width'), 10);
            }
            // Here Set Width of each th from gridview to new table th
            $("th:nth-child(" + (i + 1) + ")", gridHeader).css('width', headerWidth.toString() + "px");
            // Here Set height of each th from gridview to new table th
            $("th:nth-child(" + (i + 1) + ")", gridHeader).css('height', ($(this).height()).toString() + "px");
        });
        // Append Header to the div controlHead
        $("#headerDiv").append(gridHeader);
        // Set its position to be fixed
        $('#headerDiv').css('position', 'absolute');
        // Bring the header in front of everything else
        $('#headerDiv').css('z-index', '200');
        // Put it on top
        //$('#headerDiv').css('top', '-10');
    }
</script>

4) No need for Gridview border in ascx
also GridLines="None"

.rowStyle td {
    border: 1px solid #CDCDCD;
}

.fixedHeader th {
    border: 1px solid #CDCDCD;
}

5) Consider setting mindwidth for TableDiv