視差をdivの中央に揃える方法は？

Question

マウスの座標を使って移動する視差効果を作成しました。エフェクトは機能していますが、赤い枠線の位置を親divの中心に水平および垂直に配置することはできません。視差は赤い枠の周りで、親のdiv内で有効です -

function mouseMove(event) { 
    var target = $(this); 
    var dot = target.find('.pointer'); 

    var height = dot.height(); 
    var width = dot.width(); 

    var offset = target.offset(); 
    var w = target.width(); 
    var h = target.height(); 
    var top = offset.top; 
    var left = offset.left; 

    var mX = (event.pageX - left) - width/2; 
    var mY = (event.pageY - top) - height/2; 

    TM.to(dot, 1, { x: mX, y: mY, scale: 1, ease: Quint.easeOut, force3D: !0 }); 


    var icon = $('.icon'); 
    var iWidth = icon.width(); 
    var iHeight = icon.height(); 

     var factor = .05; 
     var x = ((event.pageX - left) - (iWidth/2)) * factor; 
     var y = ((event.pageY - top) - (iHeight/2)) * factor; 

    TM.to(icon, 1, { x: x, y: y, scale: 1, ease: Quint.easeOut, force3D: !0 }); 


}; 

http://codepen.io/anon/pen/oLQWOG

は、誰かが私を助けることを願って！

UPDATE

Answer 1

ニース視差。赤いボックスを中心にしたい場合は、margin: 0 autoのすべてが必要でした。

.icon { 
    height: 150px; 
    width: 150px; 
    display: block; 
    background: red; 
    margin: 0 auto; 
}