Skip to main content
Inspiring
December 15, 2025
Question

Suggestions for creating multiple versions of an Animate file for exporting multiple versions

  • December 15, 2025
  • 1 reply
  • 73 views
I am trying to think of hacks that would take less time than manually turning on and off layer visibility of logos and then exporting separately multiple times. The versions are SVG logos. HTML5 Canvas export so index.html file and images folder. Since I do use a publish template I was thinking about a CSS div in the publish file hat includes the images that are different by version, and then manually commenting them out and doing a save as to create the different versions. But. That is still time consuming. Is there a script that could accomplish image swaps and saves without human intervention? Has anyone ever created multiple versions from one file in Animate using javascript and then exporting as multiple versions?

    1 reply

    December 17, 2025

    So I have decided to pursue placing the set of logos above the animate export in the publish settings file.

      .content-with-foreground {
        position: relative; /* Establish positioning context */
        height: 250px; /* Set a height for the div */
        padding: 0;
    }
    .content-with-foreground::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 300px;
        height: 250px;
        background-image:  url('images/logo_KRO_300x250_XXX.svg'),
            url('images/ABC_300x250.svg'), 
            url('images/DEF_300x250.svg'),
            url('images/GHI_300x250.svg'),
            url('images/KLM_300x250.svg'),
            url('images/NOP_300x250.svg'),
            url('images/QRS_300x250.svg'),
            url('images/TUV_300x250.svg'),
             url('images/WXY_300x250.svg'),
             url('images/ZZZ_300x250.svg'),
          url('images/123_300x250.svg'),
             url('images/456_300x250.svg');
        background-size: cover;
        z-index: 100; /* Place the pseudo-element behind the div's actual content */
    }

     To make it even more efficient than simply commenting out all logos but one, is there a javascript code that would cycle through and perform a save as that appends the logo name in the file?