Defining where in the DOM CreateImg() creates its image.

sai

I am adding a gif to a p5js sketch using createImg() due to lack of native support for gifs and the p5.gif.js library unable to load external gifs.

How can I define where the img tag should be inserted into the DOM?

For example I'd like it to be inserted inside an existing div with the id of "img-container".

I googled the vanilla javascript way of doing this with appendChild(); however I got a "Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'" error.

GoToLoop

All createXXX() functions create a p5.Element object:
http://p5js.org/reference/#/libraries/p5.dom

All of them got DOM methods such as parent(), child(), id(), class(), etc.

However, if you prefer to directly access their underlying HTMLElement, use their property elt:
http://p5js.org/reference/#/p5.Element/elt

This way, you can directly use native JS DOM functions. *-:)

GoToLoop

An old post about p5.gif library:
https://forum.Processing.org/two/discussion/16053/p5-gif-question

sai

Ahhh thank you, I looked at the 5pjs reference but failed to look at the DOM library reference, which it specifically tells you to look at first thing on the page......

Thanks again:)