Question

Why can't I see the fade between pages on my computer, as seen in the GIF below? One of I'm friends can see it.

Comments

oops i thought this was a trollpost at first. I also have the fade on my laptop, but not on iPhone or iPad. What browser are you using?

---

I use Firefox on Windows 11. The GIF was recorded on Windows 10 Chrome. I will admit the way it has been presented makes it seem like a troll post. I just thought it was funny. If there's a reason for it (even if it is just a browser setting) I would legitimately like to know.

---

I use Vivaldi on Windows 11.-- maybe try a different browser just to see if it works? That way, we can at least rule it down to a browser thing.

---

Pokemondb.net does fade between pages on Edge. I tried some other websites as well, but they all behave the same as they did on firefox (not fading)

Answer 1

Looks like it's caused by a CSS psuedoclass called ::view-transition (documentation) that is being used in the user agent stylesheet for Chromium browsers. The pseudoclass was only introduced last year and hasn't been implemented in Firefox at all, which would explain the inconsistent behaviour.

Specifically, I think it's these selectors, but browsers don't let you disable these so it's hard to verify:

html::view-transition-new(root) {
    animation-name: -ua-view-transition-fade-in, -ua-mix-blend-mode-plus-lighter;
}
html::view-transition-old(root) {
    animation-name: -ua-view-transition-fade-out, -ua-mix-blend-mode-plus-lighter;
}

I realise this probably means nothing to you. Basically, the fade is being added to the site as a default behaviour in basically all browsers except Firefox and Safari.

Comments

fizz is master

Answer 2

It's from a new(ish) CSS property, @view-transition (CSS is the programming language that defines the look/design of the site, for anyone that doesn't know).

It's actually been on the site for a long time (maybe a year?), but it was only available behind a browser setting as it was in a testing phase. It's now released in Chrome (plus Edge which uses the same system), but not in Firefox or Safari yet.

Haven't decided whether I actually like it yet! Hopefully it doesn't get annoying.