A banner template for the Double Midscroll format, that allows for the easy creation of a “Elevator Scroller” type creative. The template requires a background asset (image or video), and a scrolling overlay image that slides into view as the user scrolls. The format moves with the page in a “sticky” way, causing it scroll with the page content at first, pause and lock in place while the overlay scrolls up, and then move with the page again while it scrolls out of view.
The template works across both desktop and mobile. The overlay is configurable, allowing options for the way it is scaled and positioned on top of the background.
Examples
Format Specs
Background Asset
Image - JPG
- Mobile: 1080x1920
- Desktop: 2560x1440
Video - MP4
- Mobile: 1080x1920
- Desktop: 1920x1080
Overlay Image
PNG with a transparent background.
Dimensions are flexible, but match to background asset size as a maximum.
Format description and guidance
To enable the correct behaviour of this template, set the scroll behaviour of the Double Midscroll format to “sticky”.
The background asset will be scaled to always cover the width and height of the browser window, so depending on screen size, the edges of the asset may appear cropped. Keep all essential elements towards the middle of the background asset.
For the overlay, upload a PNG with a transparent background. There are no strict requirements around the dimensions for the overlay itself, you can specify a maximum width and height that it should occupy (as a % of total screen size). You can also specify how it should be positioned or aligned (default is mid-center). Ensure sufficient contrast between the background and the overlay - drop shadows, or semi-solid colours can help. For best results, avoid exporting the overlay PNG with any unnecessary empty space, and set the max width and height as desired.
Max total file weight:
3.5 MB
Audio
No