关于纯JQ实现表格固定行与列

关于纯JQ实现表格固定行与列

不用任何的插件实现该功能，页面大家自己写，在这里就不展示了，只展示JQ部分

<script>
	 //div_FT_1_3F079727ECCFCE35684F_sub 外层div的ID值
	 //#showdatatableFT_1_3F079727ECCFCE35684F table的值
	 //由于本人页面是table下还有个内嵌的table 所以就是#showdatatableFT_1_3F079727ECCFCE35684F table,不是这样的朋友可以去掉table
$("#div_FT_1_3F079727ECCFCE35684F_sub").scroll(function () {
        var left=$("#div_FT_1_3F079727ECCFCE35684F_sub").scrollLeft();
        var top=$("#div_FT_1_3F079727ECCFCE35684F_sub").scrollTop();
        var trs=$("#showdatatableFT_1_3F079727ECCFCE35684F table tr:gt(1)");//固定行数
        var tds=$("#showdatatableFT_1_3F079727ECCFCE35684F table tr:eq(0) ");//固定列数
        var trsTwo=$("#showdatatableFT_1_3F079727ECCFCE35684F table tr:eq(0)");//固定行与列交叉处
        trsTwo.each(function (i) {
            $(this).children("td:lt(5)").css({"position":"relative","left":left,"top":top,"background-color":"#ccc","z-index":"3100"})
        })
        trs.each(function(i){
            $(this).children("td:lt(5)").css({"position":"relative","left":left,"background-color":"","z-index":"2"})
        })//由于本人是了隐藏行，所以是写的冻结前5行
        tds.each(function (i) {
            $(this).children("td:gt(4)").css({"position":"relative","top":top,"background-color":"#ccc","z-index":"1"});
        })//冻结前4列
    })
 </script>

效果图如下：
只有这个将就看