Fast copy preview tool

The Problem

It is fiddly, and time consuming to repeatedly watch through a banner animation, adding stop code to frames etc, in order to setup and layout copy.
In addition, when copy changes inevitably come through, the process needs to be repeated to ensure no text wrapping/overflowing has occured, and to fix it because it almost always does...

The Solution

Clone all frames, with imagery and copy, then display each in a separate static div to give a quick overview, maintaining relevant css to allow edits.

Before:

Example of Heathrow 4 frame banner

After:

Banner, together with fast preview frames.
(There is a short delay before frames are drawn.)