# Switch Between Multiple p5.js Sketches in Single Webpage

**URL:** <https://discourse.processing.org/t/switch-between-multiple-p5-js-sketches-in-single-webpage/9981>\
**Category:** Project Guidance\
**Created:** [April 4, 2019, 10:15pm UTC](https://discourse.processing.org/t/switch-between-multiple-p5-js-sketches-in-single-webpage/9981 "2019-04-04T22:15:48Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [April 5, 2019, 8:30pm UTC](https://discourse.processing.org/t/switch-between-multiple-p5-js-sketches-in-single-webpage/9981/4 "2019-04-05T20:30:08Z")

</div>

> [@CalebMarcoux](#):
>
> If I were to use iframes, how would I go about pausing sketches when a new one is loaded?

Assuming you have a variable _iframe_ which points to the HTMLIFrameElement of the running sketch you wanna pause, you can call: `iframe.contentWindow.noLoop();`

> **[HTMLIFrameElement: contentWindow property - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLIFrameElement/contentWindow)**
>
> The contentWindow property returns the Window object of an HTMLIFrameElement.

Alternatively, the _window_ property of each HTMLIFrameElement is stored in the _frames[]_ pseudo-array:

> **[Window: frames property - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/frames)**
>
> Returns the window itself, which is an array-like object, listing the direct sub-frames
> of the current window.

Let’s say you wanna pause the sketch running at the 3rd created HTMLIFrameElement, you simply call: `frames[2].noLoop();`

---

_[View the full topic](https://discourse.processing.org/t/switch-between-multiple-p5-js-sketches-in-single-webpage/9981)._