[LADYX]

Добрый день! Есть скрипт эффекта параллакс. Для блока .left меняется отступ с левой стороны от 300px до 0. Как сделать, чтобы также для блока .right менялся отступ с правой стороны, а для блока .top отступ сверху? Благодарю!

$(function() {

var $win = $(window),
    $rev = $('.left'),
    winH2 = 0,
    winSt = 0;

function reveal() {
  
  winSt = $win.scrollTop();
  winH2 = $win.height()/2;
  
  $rev.each(function(i, el){
    var y = el.getBoundingClientRect().top,
        toMiddleMax = Math.max(0, y-winH2),
        idealMarg   = Math.min(300, toMiddleMax),
        margMin     = Math.min(idealMarg, idealMarg * (toMiddleMax/winH2));
    $(">div", this).css({transform: "translateX("+ margMin +"px)"});
  });
  
}
$win.on({
  "load resize scroll" : reveal
});

});

*{box-sizing:border-box; -webkit-box-sizing:border-box;}
html, body{height:100%; margin:0;}

p {height:400px;}

.left,
.right,
.top {
  height: 100px;
  width: 100px;
  padding: 40px;
  margin: 10px;
}
.left {background:red;}
.right {background:green;}
.top {background:blue;}

<p></p>
<div class="left"></div>
<div class="left"></div>
<div class="right"></div>
<div class="right"></div>
<div class="top"></div>
<div class="top"></div>