window.scrollに修正

HTML

<input type="button" value="開始" onClick="TimeId=setInterval(window.scroll,100)" style="position:absolute;left:50px;top:20px" />
<input type="button" value="停止" onClick="stop()" style="position:absolute;left:90px;top:20px" />
<img id="myimg" src="number.gif" style="position:absolute;left:50px;top:50px;clip:rect(0px,60px,60px,0px)" />
<ul style="margin: 5em 0 0">
 <li><a href="https://teratail.com/questions/259966">JavaScript - javascript rect 画像スクロールのプログラム｜teratail</a></li>
</ul>

JavaScript

'use strict';
var cy=0,y=50,TimeId;

function stop()
{
  clearInterval(TimeId);
  var obj=document.getElementById("myimg");
  cy=parseInt(cy/60)*60;
  y=parseInt((y-50)/60)*60+50;
  obj.style.clip="rect("+cy+"px,60px,"+(cy+60)+"px,0px)";
  obj.style.top=y+"px";
}

function scroll()
{
  var obj=document.getElementById("myimg");
  obj.style.clip="rect("+cy+"px,60px,"+(cy+60)+"px,0px)";
  obj.style.top=y+"px";
  cy+=10;
  y-=10;

  if (cy>=60*10){
    cy=0;
    y=50;
  }
}