关于使用css3属性：transform固定菜单位置，在滑动页面时菜单闪现抖动的问题

 1 myScroll = new IScroll(‘#h-s-wrapper‘, { 2 ????????scrollX: true, 3 ????????scrollY: true, 4 ????????probeType: 3, 5 ????????mouseWheel: true, 6 ????????bounce: false, ???????//锁定边界，不允许拖拽 7 ????????//click: true 8 ????????//preventDefault: false, 9 ????????preventDefaultException: { tagName: /^(INPUT|TEXTAREA|BUTTON|SELECT|A)$/ }10 ????});11 ????myScroll.on(‘scroll‘, updatePosition);12 ????myScroll.on(‘scrollEnd‘, loadNewData);

 1 function updatePosition() { 2 ????/// <summary>设置锁定表头、列</summary> 3 ????var iTop = this.y; 4 ????var iLeft = this.x; 5 ????//上下滑动，当iTop为负值时，表明容器的顶边在Y轴上0位置上边 6 ????if (iTop < 0) { 7 ????????//$(‘#h-s-content table thead tr‘).css(‘transform‘, ‘translate(0px, ‘ + Math.abs(iTop) + ‘px)‘);//使用translate，在上下滑动页面时，固定的菜单会出现抖动现象 8 ????????$(‘#h-s-content table thead tr‘).css(‘transform‘, ‘translate3d(0px, ‘ + Math.abs(iTop) + ‘px,0px)‘); 9 10 ????} else {11 ????????//此处设置为0，因为存在惯性滑动，向下滑动时会导致容器的坐标会越过Y轴的0坐标，变成正值，会造成设置thead表头的坐标向下偏移12 ????????$(‘#h-s-content table thead tr‘).css(‘transform‘, ‘translate3d(0px, 0px, 0px)‘);13 ????}14 ????//左右滑动；当iLeft为负值时，表明容器的左侧边在X轴上0位置的左侧15 ????if (iLeft < 0) {16 ????????$(‘#h-s-content table tr th:first-child, td:first-child‘).css(‘transform‘, ‘translate3d(‘ + Math.abs(iLeft) + ‘px, 0px,0px)‘);17 ????} else {18 ????????$(‘#h-s-content table tr th:first-child, td:first-child‘).css(‘transform‘, ‘translate3d(0px, 0px, 0px)‘);19 ????}20 }