Remove animations when printing

Design help Animations & Interactions
1

Hi,

I’m trying to improve the ‘printability’ of my site. Unfortunately, it appears that my slide-in animation causes content to be invisible at print time.

Normal use: the user scrolls down and then a div slides and fades in
When printing: the div is not printed

In Chrome or Firefox, if I scroll until the div animation runs, it is then visible when printed.

I assume the animation default state is causing this issue. Could somebody help me remove the animations when printing?

Thank you for any help you can provide,

Cameron

Here is my test link:
https://printing-test-c253e6.webflow.io/

Here is my public share link:
https://preview.webflow.com/preview/printing-test-c253e6?utm_medium=preview_link&utm_source=dashboard&utm_content=printing-test-c253e6&preview=c222addfd49c30f92136654da050addb&mode=preview

2

Since you can’t restore animations if you use the following method, you may want to work on a copy of the presentation (or slide) and retain the original with animations.

To remove animations on a single slide:

  1. In Normal View, display the slide with the animations you wish to remove.
  2. Click an object on the slide. If you are selecting a placeholder, click its edge.
  3. Press Ctrl + A to select all objects on the slide.
  4. Click the Animations tab in the Ribbon.
  5. If necessary, click the More down arrow in the Animations gallery in the Animation group.
  6. Click None. Repeat for other slides.