在父母内部动画儿童

Question

我正在尝试使用TweenMax为父div中的子div设置动画。动画应该从父div中的随机位置开始（这非常好）。但动画不应该超出父div。如何让孩子从随机起始位置生成动画，但不能超出父div？

到目前为止，这是我的js：

var main = $('.outer');
var box = $('.inner');

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

$( '.inner' ).each(function( index ) {
  $(this).css({
    left : Math.random() * ($('.inner').width() - $(this).width()),
    top : Math.random() * ($('.inner').height() - $(this).height())
  });
});

function randomNumber(min, max) {
  return (Math.random() * (max - min)) + min;
}

TweenLite.defaultEase = Linear.easeNone;
var tl = new TimelineLite()

tl.to(".inner", 3.05, {x:randomNumber(0, width), repeat:-1, yoyo:true})
  .to(".inner", 3.4, {y:randomNumber(0, height), repeat:-1, yoyo:true}, 0)

Fiddle