Hacker News Reader

Comment by mrob | Hacker News Reader

From my chrome/userContent.css in my Firefox profile directory:

  @namespace url(http://www.w3.org/1999/xhtml);
  *, :before, :after {
  transition: none !important;
  animation-delay: 0ms !important;
  animation-duration: 0ms !important;
  }

toolkit.legacyUserProfileCustomizations.stylesheets must be set to true in about:config for this to work.

This gives me the best "reduced motion" of all (zero motion), with no effort required from developers, and unlike the official preference, does not leave me vulnerable to the no-Javascript fingerprinting discussed at https://news.ycombinator.com/item?id=30237846 . I haven't noticed it breaking anything important. The same can be put in chrome/userChrome.css (without the namespace header) to remove the annoying animations from Firefox itself, at the cost of occasionally breaking the tab bar (it can be fixed by dragging a tab to blank space and then immediate closing it).

I've never seen a UI animation I thought was necessary.

View on HN

Unfortunately it does break a surprising number of websites that just looove animations and in very annoying ways.

I was using https://addons.mozilla.org/en-US/firefox/addon/no-transition... which operates on the same principle.

You can try yourself it breaks the google login form. You don't need an account to try: just "login", enter a random address, and watch the password prompt not being enabled as it waits for the transition to complete.

Similarly, slack breaks doing random actions that have some blur animation you often don't notice. It's usually always a consequence of transitions and animations that are chained with JS events.

I tried myself to come up with some attributes that would be more robust (just as reducing the step count instead of disabling the animation completely), but nothing has worked in a reliable way.

Count me in as one of the folks that hates animations in UIs, so I would really love to hear if anybody has a solution to this.

> I was using https://addons.mozilla.org/en-US/firefox/addon/no-transition... which operates on the same principle.

This extension doesn't seem to be available anymore.

The github link:

https://github.com/gagarine/no-transition

although it's not the only one (see https://github.com/jnlon/disable-transitions).

toolkit.legacyUserProfileCustomizations.stylesheets must be set to true in about:config for this to work

...the fact that it's called "legacy" is ominous and a sign of things to come. The fact that other browsers have been quite aggressive at slowly destroying any real form of user-controlled customisation is quite telling too. (For exmaple, did you know that IE supported user stylesheets all the way up to its last version, but Edge no longer does? And Chrome removed that functionality over half a decade ago.)

This will break sites that count on "transitionend" event callbacks to determine when one part of an animation has finished to begin doing something else.

Can this be fixed with 1ms timings instead of 0ms?

Reply on news.ycombinator.com