如何将视差与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

更新

Answer 1

很好的视差。如果您的意思是想要将红色框margin: 0 auto置于中心位置，那就是您需要的全部内容。

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