求助，关于使用百分比单位来定位元素的问题！

目前元素使用的position: absolate; top: xxpx, left: xxpx;

//    给元素绑定 定位功能
            elem.on('touchstart', function(event){
                var start, touch, elem_pos_left, elem_pos_top;

                touch = event.originalEvent.targetTouches[0];
                start = { x : touch.pageX, y : touch.pageY };
                
                elem_pos_left = parseInt($(this).css('left'));
                elem_pos_top  = parseInt($(this).css('top'));

                $(this).on('touchmove', function(event){
                    var offset, touch;
                    //  判断，当屏幕上面手指数量大于1时返回 判定为旋转
                    if(event.originalEvent.targetTouches.length > 1) return;

                    touch = event.originalEvent.targetTouches[0];
                    //  手指移动的偏移量
                    offset = { x : touch.pageX - start.x, y : touch.pageY - start.y };
                    //  元素的当前的坐标 + 手指移动的偏移量
                    if (elem.hasClass('active')) {
                         $(this).css({ left : elem_pos_left + offset.x, top  : elem_pos_top +  offset.y});
                    };
                
                    //  后续优化为translate
                    // this.style.webkitTransform = 'translate(' + offset.x + 'px, ' + offset.y + 'px)';
                });

                $(this).one('touchend', function(){console.log("real");
                    $(this).off('touchmove');
                });

            });
    

其实也运行良好，但是定位的基准父元素是使用百分比居中与屏幕的，也就导致父元素放大后，元素错位的问题，我试了下，如果子元素也使用百分比定位的话则不会错位，问题是，如果使用百分比进行定位的话，我手指触摸的偏移量是已px读取了，这样我不知道怎么换算为%单位啊，求高人指点，搞定立马发红包，