# Getting a sketch to load between two images on a web page **URL:** \ **Category:** Beginners\ **Created:** [January 22, 2019, 9:13am UTC](https://discourse.processing.org/t/getting-a-sketch-to-load-between-two-images-on-a-web-page/7734 "2019-01-22T09:13:16Z")\ **Posts on this page:** 3\ **Page:** 1
**Author:** ![akathewb](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/akathewb/32/3364_2.png) [@akathewb](https://discourse.processing.org/u/akathewb)\ **Post date:** [January 22, 2019, 9:13am UTC](https://discourse.processing.org/t/getting-a-sketch-to-load-between-two-images-on-a-web-page/7734/1 "2019-01-22T09:13:16Z")
I’d like the script with the sketch.js to load between the two images, but it keeps loading at the end of the two images. Just learning HTML so any help would be great! Thanks! Web page: [http://www.abunchoffailures.com/](http://www.abunchoffailures.com/) Here is the HTML: ```auto A bunch of failures

1. Creativity means not being afraid to fail
2. The ideas here now are not as good as the ideas I'm going to put here later
3. Be excellent to each other

``` ---
**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:** [January 22, 2019, 11:33am UTC](https://discourse.processing.org/t/getting-a-sketch-to-load-between-two-images-on-a-web-page/7734/2 "2019-01-22T11:33:45Z")
> [@akathewb](#): > > I’d like the `

  1. Creativity means not being afraid to fail
  2. The ideas here now are not as good as the ideas I'm going to put here later
  3. Be excellent to each other

``` ## style.css: ```auto @import url('https://Fonts.GoogleAPIs.com/css?family=Permanent+Marker'); h1 { font-family: 'Permanent Marker', cursive; } canvas { display: block; } ``` ## sketch.js: ```javascript /** * Place Canvas Between 2 Images (v1.0) * by AkaTheWb (Aaron Smith) * mod GoToLoop (2019-Jan-22) * * https://Discourse.Processing.org/t/ * getting-a-sketch-to-load-between-two-images-on-a-web-page/7734/2 * * http://Bl.ocks.org/GoSubRoutine/56bc62553a754febacfe61e6f9239c69 */ "use strict"; function setup() { createCanvas(400, 400).parent('between'); fill('red').noStroke(); } function draw() { background(220); ellipse(noise(frameCount * .01) * width, height>>1, width>>2, height>>2); } ``` ---
**Author:** ![akathewb](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/akathewb/32/3364_2.png) [@akathewb](https://discourse.processing.org/u/akathewb)\ **Post date:** [January 23, 2019, 2:53am UTC](https://discourse.processing.org/t/getting-a-sketch-to-load-between-two-images-on-a-web-page/7734/3 "2019-01-23T02:53:40Z")
Thank you so much for the detailed reply with sources and refactoring my code…really helps with learning this new material! 💪🤘👍🧙