X
Tap here to go to the mobile version of the site.

Support Forum

Any way to complete a page's animations *before* reading it?

Posted

Many sites include migraine-inducing animations. It's hard to block these animations, but maybe it would be easier to run them to completion before reading the pages.

Right now, Firefox doesn't run the animations while the tabs are in the background, only when we move them to the foreground, and try to read them, and this means sites can punch users precisely when we are vulnerable to the migraine-inducing animations.

Ideally, I'd like some way to complete all time-based and scroll-position-based and exit-based animations, including sticky elements, first, so I can remove them and read the page at my leisure without getting hit by these animations. But completeling any category would help.

Many sites include migraine-inducing animations. It's hard to block these animations, but maybe it would be easier to run them to completion before reading the pages. Right now, Firefox doesn't run the animations while the tabs are in the background, only when we move them to the foreground, and try to read them, and this means sites can punch users precisely when we are vulnerable to the migraine-inducing animations. Ideally, I'd like some way to complete all time-based and scroll-position-based and exit-based animations, including sticky elements, first, so I can remove them and read the page at my leisure without getting hit by these animations. But completeling any category would help.

Additional System Details

Application

  • Firefox 61.0.2
  • User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:61.0) Gecko/20100101 Firefox/61.0
  • Support URL: https://support.mozilla.org/1/firefox/61.0.2/Darwin/en-US/

Extensions

  • Absolute Enable Right Click & Copy 1.3.0 ({9350bc42-47fb-4598-ae0f-825e3dd9ceba})
  • Activate Reader View 0.1.0 (@activatereaderview)
  • Block Site 0.1.8 ({07046613-1993-4b66-9dd1-9dd1ce581cb7})
  • Coin Mining Blocker 0.1.0 ({55127384-b7ad-4be2-8429-2251bdd6a47e})
  • Ecosia - The search engine that plants trees 4.0.4 ({d04b0b40-3dab-4f0b-97a6-04ec3eddbfb0})
  • EpubPress - Read the web offline 0.10.2 ({8f64ef8c-eaa3-4609-a494-1f1b9126efce})
  • Ghostery – Privacy Ad Blocker 8.2.4 (firefox@ghostery.com)
  • Google search link fix 1.6.7 (jid0-XWJxt5VvCXkKzQK99PhZqAn7Xbg@jetpack)
  • Grayscale Browsing 1.2 ({9b0552d7-b08e-49d4-a0d9-f03121b8f4a5})
  • Greasemonkey 4.7 ({e4a8a97b-f2ed-450b-b12d-ee082ba24781})
  • Hide Fixed Elements 1.2 (hidefixedelements@commonground.systems)
  • Lightbox Blocker 1.0 ({0c02e21f-e709-4e17-aba0-0594833e7f07})
  • No Transition 1.1.8 ({8b5fde66-c64d-4a33-99f1-c7c94138d67e})
  • Personal Blocklist (not by Google) 2.9.0 (personal_blocklist@wildsky.cc)
  • Save Page WE 12.1 (savepage-we@DW-dev)
  • Simple Google Translate 1.0 ({b8ad88f9-9e0a-4e53-bbeb-aba448290381})
  • Stylus 1.4.20 ({7a7a4a92-a2a0-41d1-9fd7-1e92480d612d})
  • Tumblr Savior 0.5.7 (jid1-W5guVoyeUR0uBg@jetpack)
  • uBlock Origin 1.16.20 (uBlock0@raymondhill.net)
  • YesScript2 4.3 (yesscript202@example.org)
  • Zoom Page WE 12.0 (zoompage-we@DW-dev)
  • 404 Bookmarks 1.6 ({5f8d31ba-47fb-4b70-bf8d-d2113f6da22f}) (Inactive)
  • Bookmark Dupes 5.7 (bookmarkdupes@martin-vaeth.org) (Inactive)
  • Copy Plain Text WE 1.2.4 (CopyPlainTextWE@yuki) (Inactive)
  • Enterprise Policy Generator 3.1.1 (enterprise-policy-generator@agenedia.com) (Inactive)
  • Gothic font converter 1.5 (gothicscriptconverter@mozilla.org) (Inactive)
  • HTTPS Everywhere 2018.6.21 (https-everywhere@eff.org) (Inactive)
  • JavaScript Toggle On and Off 0.2.2 ({479f0278-2c34-4365-b9f0-1d328d0f0a40}) (Inactive)
  • Policy Control - JavaScript and Flash blocker 0.3.5 (jid1-gHwvGmJ8Ii9oOq@jetpack) (Inactive)
  • Save as eBook 1.3.4 ({087005dc-849e-419b-acf6-32da1f83691d}) (Inactive)
  • uMatrix 1.3.14 (uMatrix@raymondhill.net) (Inactive)

Javascript

  • incrementalGCEnabled: True

Graphics

  • adapterDescription:
  • adapterDeviceID: 0x0a26
  • adapterDrivers:
  • adapterRAM:
  • adapterVendorID: 0x8086
  • contentUsesTiling: True
  • crashGuards: []
  • driverDate:
  • driverVersion:
  • featureLog: {u'fallbacks': [], u'features': [{u'status': u'disabled', u'description': u'Compositing', u'log': [{u'status': u'available', u'type': u'default'}, {u'status': u'disabled', u'message': u'Disabled by pref', u'type': u'user'}], u'name': u'HW_COMPOSITING'}, {u'status': u'unavailable', u'description': u'OpenGL Compositing', u'log': [{u'status': u'unavailable', u'message': u'Hardware compositing is disabled', u'type': u'default'}], u'name': u'OPENGL_COMPOSITING'}, {u'status': u'unavailable', u'description': u'WebRender', u'log': [{u'status': u'opt-in', u'message': u'WebRender is an opt-in feature', u'type': u'default'}, {u'status': u'unavailable', u'message': u"Build doesn't include WebRender", u'type': u'runtime'}], u'name': u'WEBRENDER'}, {u'status': u'available', u'description': u'Off Main Thread Painting', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'OMTP'}]}
  • info: {u'TileHeight': 512, u'ApzWheelInput': 1, u'ApzDragInput': 1, u'ApzKeyboardInput': 1, u'ApzAutoscrollInput': 1, u'AzureFallbackCanvasBackend': u'none', u'TileWidth': 512, u'AzureCanvasAccelerated': 0, u'AzureCanvasBackend': u'skia', u'AzureContentBackend': u'skia'}
  • numAcceleratedWindows: 0
  • numAcceleratedWindowsMessage: [u'']
  • numTotalWindows: 1
  • offMainThreadPaintEnabled: True
  • offMainThreadPaintWorkerCount: 1
  • usesTiling: True
  • webgl1DriverExtensions: GL_ARB_blend_func_extended GL_ARB_draw_buffers_blend GL_ARB_draw_indirect GL_ARB_ES2_compatibility GL_ARB_explicit_attrib_location GL_ARB_gpu_shader_fp64 GL_ARB_gpu_shader5 GL_ARB_instanced_arrays GL_ARB_internalformat_query GL_ARB_occlusion_query2 GL_ARB_sample_shading GL_ARB_sampler_objects GL_ARB_separate_shader_objects GL_ARB_shader_bit_encoding GL_ARB_shader_subroutine GL_ARB_shading_language_include GL_ARB_tessellation_shader GL_ARB_texture_buffer_object_rgb32 GL_ARB_texture_cube_map_array GL_ARB_texture_gather GL_ARB_texture_query_lod GL_ARB_texture_rgb10_a2ui GL_ARB_texture_storage GL_ARB_texture_swizzle GL_ARB_timer_query GL_ARB_transform_feedback2 GL_ARB_transform_feedback3 GL_ARB_vertex_attrib_64bit GL_ARB_vertex_type_2_10_10_10_rev GL_ARB_viewport_array GL_EXT_debug_label GL_EXT_debug_marker GL_EXT_framebuffer_multisample_blit_scaled GL_EXT_texture_compression_s3tc GL_EXT_texture_filter_anisotropic GL_EXT_texture_sRGB_decode GL_APPLE_client_storage GL_APPLE_container_object_shareable GL_APPLE_flush_render GL_APPLE_object_purgeable GL_APPLE_rgb_422 GL_APPLE_row_bytes GL_APPLE_texture_range GL_ATI_texture_mirror_once GL_NV_texture_barrier
  • webgl1Extensions: ANGLE_instanced_arrays EXT_blend_minmax EXT_color_buffer_half_float EXT_frag_depth EXT_sRGB EXT_shader_texture_lod EXT_texture_filter_anisotropic EXT_disjoint_timer_query OES_element_index_uint OES_standard_derivatives OES_texture_float OES_texture_float_linear OES_texture_half_float OES_texture_half_float_linear OES_vertex_array_object WEBGL_color_buffer_float WEBGL_compressed_texture_s3tc WEBGL_compressed_texture_s3tc_srgb WEBGL_debug_renderer_info WEBGL_debug_shaders WEBGL_depth_texture WEBGL_draw_buffers WEBGL_lose_context
  • webgl1Renderer: Intel Inc. -- Intel HD Graphics 5000 OpenGL Engine
  • webgl1Version: 4.1 INTEL-10.25.19
  • webgl1WSIInfo: CGL
  • webgl2DriverExtensions: GL_ARB_blend_func_extended GL_ARB_draw_buffers_blend GL_ARB_draw_indirect GL_ARB_ES2_compatibility GL_ARB_explicit_attrib_location GL_ARB_gpu_shader_fp64 GL_ARB_gpu_shader5 GL_ARB_instanced_arrays GL_ARB_internalformat_query GL_ARB_occlusion_query2 GL_ARB_sample_shading GL_ARB_sampler_objects GL_ARB_separate_shader_objects GL_ARB_shader_bit_encoding GL_ARB_shader_subroutine GL_ARB_shading_language_include GL_ARB_tessellation_shader GL_ARB_texture_buffer_object_rgb32 GL_ARB_texture_cube_map_array GL_ARB_texture_gather GL_ARB_texture_query_lod GL_ARB_texture_rgb10_a2ui GL_ARB_texture_storage GL_ARB_texture_swizzle GL_ARB_timer_query GL_ARB_transform_feedback2 GL_ARB_transform_feedback3 GL_ARB_vertex_attrib_64bit GL_ARB_vertex_type_2_10_10_10_rev GL_ARB_viewport_array GL_EXT_debug_label GL_EXT_debug_marker GL_EXT_framebuffer_multisample_blit_scaled GL_EXT_texture_compression_s3tc GL_EXT_texture_filter_anisotropic GL_EXT_texture_sRGB_decode GL_APPLE_client_storage GL_APPLE_container_object_shareable GL_APPLE_flush_render GL_APPLE_object_purgeable GL_APPLE_rgb_422 GL_APPLE_row_bytes GL_APPLE_texture_range GL_ATI_texture_mirror_once GL_NV_texture_barrier
  • webgl2Extensions: EXT_color_buffer_float EXT_texture_filter_anisotropic EXT_disjoint_timer_query OES_texture_float_linear WEBGL_compressed_texture_s3tc WEBGL_compressed_texture_s3tc_srgb WEBGL_debug_renderer_info WEBGL_debug_shaders WEBGL_lose_context
  • webgl2Renderer: Intel Inc. -- Intel HD Graphics 5000 OpenGL Engine
  • webgl2Version: 4.1 INTEL-10.25.19
  • webgl2WSIInfo: CGL
  • windowLayerManagerRemote: True
  • windowLayerManagerType: Basic
  • windowUsingAdvancedLayers: False

Modified Preferences

Misc

  • User JS: No
  • Accessibility: No

Question owner

Would "layout.animation.prerender.partial" in about:config help here?

Would "layout.animation.prerender.partial" in about:config help here?
WestEnd
  • Top 25 Contributor
62 solutions 5373 answers

That is something out of FF/Mozilla control but comes from the site itself. you should contact their webmaster about the problem. Mozilla by default itself will not block those on site animations. To do that goes beyond Mozilla enduser help here.

That is something out of FF/Mozilla control but comes from the site itself. you should contact their webmaster about the problem. Mozilla by default itself will not block those on site animations. To do that goes beyond Mozilla enduser help here.
McCoy
  • Top 10 Contributor
520 solutions 4893 answers

MarjaE said

Would "layout.animation.prerender.partial" in about:config help here?

You could give it a try .....

Would "image.animation_mode" set to "none" not work for you  ?

''MarjaE [[#answer-1148864|said]]'' <blockquote> Would "layout.animation.prerender.partial" in about:config help here? </blockquote> You could give it a try ..... Would "image.animation_mode" set to "none" not work for you ?
cor-el
  • Top 10 Contributor
  • Moderator
17416 solutions 157342 answers

Helpful Reply

pre-rendering means that Firefox tries to prepare possible frames to make it faster to start the actual animation and run the animation more smoothly.

// Prefs to control the maximum area to pre-render when animating a large
// element on the compositor.
pref("layout.animation.prerender.partial", false);
pref("layout.animation.prerender.viewport-ratio-limit-x", "1.125");
pref("layout.animation.prerender.viewport-ratio-limit-y", "1.125");
pref("layout.animation.prerender.absolute-limit-x", 4096);
pref("layout.animation.prerender.absolute-limit-y", 4096);
pre-rendering means that Firefox tries to prepare possible frames to make it faster to start the actual animation and run the animation more smoothly. <pre><nowiki>// Prefs to control the maximum area to pre-render when animating a large // element on the compositor. pref("layout.animation.prerender.partial", false); pref("layout.animation.prerender.viewport-ratio-limit-x", "1.125"); pref("layout.animation.prerender.viewport-ratio-limit-y", "1.125"); pref("layout.animation.prerender.absolute-limit-x", 4096); pref("layout.animation.prerender.absolute-limit-y", 4096);</nowiki></pre>

Question owner

"image.animation_mode" "none" only blocks animated paingifpainpainpain and animated pngpainpainpainpain.

It lets all other animation through.

"image.animation_mode" "none" only blocks animated paingifpainpainpain and animated pngpainpainpainpain. It lets all other animation through.

Question owner

> you should contact their webmaster about the problem

I need to protect myself against this. I have tried to contact websites about pain/animation, but it's hard to do much with the migraines, and the only times I've heard back, from a site which would zoom images on mouseover, they've explained that they don't have any pain/animation...

> you should contact their webmaster about the problem I need to protect myself against this. I have tried to contact websites about pain/animation, but it's hard to do much with the migraines, and the only times I've heard back, from a site which would zoom images on mouseover, they've explained that they don't have any pain/animation...
WestEnd
  • Top 25 Contributor
62 solutions 5373 answers

MarjaE said

> you should contact their webmaster about the problem I need to protect myself against this. I have tried to contact websites about pain/animation, but it's hard to do much with the migraines, and the only times I've heard back, from a site which would zoom images on mouseover, they've explained that they don't have any pain/animation...

That means FF hands a tied if the site doesn't want to address or says their site doesn't have that problem then that would mean it is more related to your hardware and O/S setting that could be the cause. So if another computer shows the same problem then it can be pointed to the site as a cause.

''MarjaE [[#answer-1149008|said]]'' <blockquote> > you should contact their webmaster about the problem I need to protect myself against this. I have tried to contact websites about pain/animation, but it's hard to do much with the migraines, and the only times I've heard back, from a site which would zoom images on mouseover, they've explained that they don't have any pain/animation... </blockquote> That means FF hands a tied if the site doesn't want to address or says their site doesn't have that problem then that would mean it is more related to your hardware and O/S setting that could be the cause. So if another computer shows the same problem then it can be pointed to the site as a cause.
cor-el
  • Top 10 Contributor
  • Moderator
17416 solutions 157342 answers

Helpful Reply

See also:

  • bug 1475462 - Add support for CSS prefers-reduced-motion media feature for MacOSX [63]
  • bug 1478597 - Remove toolkit.cosmeticAnimations.enabled in favor of prefers-reduced-motion media query

(please do not comment in bug reports
https://bugzilla.mozilla.org/page.cgi?id=etiquette.html
)

See also: *https://webkit.org/blog/7551/responsive-design-for-motion/ *[https://bugzilla.mozilla.org/show_bug.cgi?id=1475462 bug 1475462] - Add support for CSS prefers-reduced-motion media feature for MacOSX [63] *[https://bugzilla.mozilla.org/show_bug.cgi?id=1478597 bug 1478597] - Remove toolkit.cosmeticAnimations.enabled in favor of prefers-reduced-motion media query (<i>please do not comment in bug reports<br>https://bugzilla.mozilla.org/page.cgi?id=etiquette.html</i>)

Modified by cor-el

Question owner

Thanks.

Ironically, the "Responsive Design" page animates on opening...

Thanks. Ironically, the "Responsive Design" page animates on opening...
Aiden 0 solutions 4 answers

There is a "Reader Mode" that can remove all of the advertisements, animations, and other garbage from articles, leaving only the text that you want to read. For most articles, there will be a button looking like a sheet of paper in the address bar. Clicking that will put the page into Reader Mode.

There is a "Reader Mode" that can remove all of the advertisements, animations, and other garbage from articles, leaving only the text that you want to read. For most articles, there will be a button looking like a sheet of paper in the address bar. Clicking that will put the page into Reader Mode.

Question owner

Yes, but Firefox doesn't allow users to load pages in reader mode, so we can't escape animation-on-loading by using reader mode.

Yes, but Firefox doesn't allow users to load pages in reader mode, so we can't escape animation-on-loading by using reader mode.
WestEnd
  • Top 25 Contributor
62 solutions 5373 answers

So then what is the page? So far we talked about it but there is no link for anyone to see what happens if they click on it. Need some examples of those pages showing the problem so to verify others get the problem or not.

So then what is the page? So far we talked about it but there is no link for anyone to see what happens if they click on it. Need some examples of those pages showing the problem so to verify others get the problem or not.

Modified by WestEnd

James
  • Moderator
1594 solutions 11232 answers

WestEnd said

That is something out of FF/Mozilla control but comes from the site itself. you should contact their webmaster about the problem. Mozilla by default itself will not block those on site animations. To do that goes beyond Mozilla enduser help here.

There are a number of Preference in Firefox that allows you to configure how say Gifs and HTML5 animation plays for example.

This is applicable to Fx support. Even if it was more of website issue as you say, you and others can still try to help.

''WestEnd [[#answer-1148881|said]]'' <blockquote> That is something out of FF/Mozilla control but comes from the site itself. you should contact their webmaster about the problem. Mozilla by default itself will not block those on site animations. To do that goes beyond Mozilla enduser help here. </blockquote> There are a number of Preference in Firefox that allows you to configure how say Gifs and HTML5 animation plays for example. This is applicable to Fx support. Even if it was more of website issue as you say, you and others can still try to help.
BillM 4 solutions 117 answers

The animations I've been objecting to for YEARS now are PART AND PARCEL of Firefox - other browsers do not force-feed animations *on the tabs* (literally, ON THE TAB) like Firefox. There was a .css-file 'fix' that worked for one or two releases - but the animation came back with the next release. This is USER-HOSTILE.

The animations I've been objecting to for YEARS now are PART AND PARCEL of Firefox - other browsers do not force-feed animations *on the tabs* (literally, ON THE TAB) like Firefox. There was a .css-file 'fix' that worked for one or two releases - but the animation came back with the next release. This is USER-HOSTILE.
jscher2000
  • Top 10 Contributor
8637 solutions 70648 answers

BillM said

The animations I've been objecting to for YEARS now are PART AND PARCEL of Firefox - other browsers do not force-feed animations *on the tabs* (literally, ON THE TAB) like Firefox.

Hi BillM, please don't hijack MarjaE's thread with your issue, which you've already posted here: https://support.mozilla.org/questions/1232771. This thread is about web page content.

''BillM [[#answer-1162748|said]]'' <blockquote> The animations I've been objecting to for YEARS now are PART AND PARCEL of Firefox - other browsers do not force-feed animations *on the tabs* (literally, ON THE TAB) like Firefox. </blockquote> Hi BillM, please don't hijack MarjaE's thread with your issue, which you've already posted here: [https://support.mozilla.org/questions/1232771]. This thread is about web page content.