Doubt HeaderFixed GridView

I'm using this code to leave the top of the GridView fixed, however it's not responsive, and it's a little bit missing to fully populate the grid.

    <script language="javascript">
        $(document).ready(function () {
            var gridHeader = $('#<%=GridView1.ClientID%>').clone(true);
            $(gridHeader).find("tr:gt(0)").remove();
            $('#<%=GridView1.ClientID%> tr th').each(function (i) {

                $("th:nth-child(" + (i + 1) + ")", gridHeader).css('width', ($(this).width()).toString() + "px");
            });
            $("#controlHead").append(gridHeader);
            $('#controlHead').css('position', 'absolute');
            $('#controlHead').css('top', $('#<%=GridView1.ClientID%>').offset().top);

        });
    </script>

I would like it to be responsive, just like the GridView is, and also be of the correct GridView size.