javascript - 使用 jquery 滑动元素

Question

我试图在我的网站上滑动一些内容，我尝试运行这段代码，但滑动只发生在第一次点击时，并且找不到原因。这是我的代码片段:HTML :

$("#go").click(function() {
  $(".block").animate({
    right: 85
  }, {
    duration: 800,
    step: function(now, fx) {
      $(".block:gt(0)").css("right", now);
    }
  });
});

div {
  position: relative;
  background-color: #abc;
  width: 70px;
  height: 70px;
  float: left;
  margin: 5px;
}

<p>
  <button id="go">Run »</button>
</p>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>

Answer 1

key 是'+=85'。

$("#go").click(function() {
  $(".block").animate({
    right: '+=85'
  }, {
    duration: 800,
    step: function(now, fx) {
      $(".block:gt(0)").css("right", now);
    }
  });
});

div {
  position: relative;
  background-color: #abc;
  width: 70px;
  height: 70px;
  float: left;
  margin: 5px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<p>
  <button id="go">Run »</button>
</p>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>
<div class="block"></div>

顺便说一句，我不知道这里的step函数到底有什么用。