Как-то так:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> interactive HTML 5 </title>
</head>
<body>
<h1 id="heading" style="user-select: none;"> 0 </h1>
<script src="https://code.jquery.com/jquery-2.1.0.js"></script>
<script>
var x=0;
var y=0;
var f =0;
var d=1;
var move= function() { $("#heading").offset( { left:x, top:y } ); x=x+d; y=y+f; if ( x > 500) {d=0; f=1; };
if (y>500) {d=-1; f=0;}; if (x<1) {d=0; f=-1}; if ( y<1 && x<1) { d=1; f=0};
};
var s=30;
var a = setInterval(move,s)
var number =[ "1","2","3","You win"];
var z=0;
var h =function () {
clearInterval(a);
$("#heading").text(number[z]);
if (z<3){
a=setInterval(move,s=s/1.5);
z++;
}
};
$("h1").click (h);
//if (z>=4) {var k =h};
//k=clearInterval(a);
</script>
</body>
</html>