# Cannot break out of requestAnimationFrame()

**URL:** <https://forum.freecodecamp.org/t/cannot-break-out-of-requestanimationframe/371392>\
**Category:** General\
**Created:** [April 11, 2020, 10:38am UTC](https://forum.freecodecamp.org/t/cannot-break-out-of-requestanimationframe/371392 "2020-04-11T10:38:47Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![whatevea](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/whatevea/32/134623_2.png) [@whatevea](https://forum.freecodecamp.org/u/whatevea)\
**Post date:** [April 11, 2020, 10:38am UTC](https://forum.freecodecamp.org/t/cannot-break-out-of-requestanimationframe/371392/1 "2020-04-11T10:38:47Z")

</div>

I tried to clone Flappy Bird and when the user collides i want to stop the animation frame and display page with last score and button . i tried this

```auto
function render(){
jumpCheck();
drawMovePipes();
writeScore();
interval=requestAnimationFrame(render)	
} 

```

and i begin the window by

```auto
$('startScreen').onclick=()=>{
	screen.canvas.style.display="block";
	$('startScreen').style.display="none";
	 interval=window.requestAnimationFrame(render);
}

```

When collison is happended this function is called

```auto
function collided(){

	cancelAnimationFrame(interval);
	screen.canvas.style.display="none";
	$('h3').innerText+=`Last Score ${score}`
	$('startScreen').style.display="block";
}

```

here the problem is the loop runs constantly and keeps adding the “last Score” text repeatedly . how to completely break from the loop like game pause or exit .

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [June 1, 2021, 6:59pm UTC](https://forum.freecodecamp.org/t/cannot-break-out-of-requestanimationframe/371392/2 "2021-06-01T18:59:51Z")

</div>