0

i'm trying to implement Images inside my javascript-file as Base64 Encoding but the Images will not show up in the HTML5 Animation.

So, my goal is, to only have 1 html canvas and 1 Javascript-Animation file, without further referenced Images. Right now, the Package i have consists of a html-File, a JS-file and a few PNG/JPG.

This is the HTML Code:

<body onload="init();" style="margin:0px;">
    <div id="animation_container" style="background-color:transparent; width:820px; height:250px">
        <canvas id="canvas" width="820" height="250" style="position: absolute; display: block; background-color:transparent;"></canvas>
        <div id="dom_overlay_container" style="pointer-events:none; overflow:hidden; width:820px; height:250px; position: absolute; left: 0px; top: 0px; display: block;">
            <div class="myClickButton" type="button" id="IAB_clicktag" ><img src="blank.png" width="100%" height="100%" onclick="clickURL();"></div>
        </div>
    </div>
</body>

And this is the Javascript-Part which hast the Images:

manifest: [
    {src:"./background_400x800.jpg", id:"background_400x800"},
    {src:"./kandidatenmin.png", id:"kandidatenmin"},
    {src:"./jakob_nicolemin.png", id:"jakob_nicolemin"}

I have no Clue how to get the Base64-Code to work in this. The HTML and JS is generated with Adobe Animate (and is about 1200lines long) to create some Animations but there is no option to automate this step.

Reason to implement those images, is, that its not possible to keep the dynamiclinks as the filepath will be changed throughout the Content Management process.

Thank you, best M

Michael V
  • 1
  • Why are you not just storing the base64 code of each image in the JS file instead? – Lain Jul 02 '20 at 08:47
  • Does this answer your question? [How to display Base64 images in HTML?](https://stackoverflow.com/questions/8499633/how-to-display-base64-images-in-html) – Reporter Jul 02 '20 at 08:57

0 Answers0