View Transitions API page scrolling up visibility problem

15 Views Asked by At

I have been exploring the new View Transitions API for MPAs (experimental for now). When I add the view transitions meta tag t pages it works okay, when using custom view transition names - eg. an image and a title move in place onto the new page - but in any other case (with the default crossfade) the old/current page scrolls up at the start of the transition visibly (a quick flash of page content) - which is a quite distracting visual bug - that ruins the whole animation for transitioning, and I can't seem to find what causes it.

I've tried to debug doing the following:

  • removed all javascript functions, the old (current) page scrolling up still appears
  • tried hiding the old or the new state while transitioning, still visible
  • tried removing all the css that was added to the new page after the view transition css rules, did nothing
  • find anything online, but its too new of an API that is still flagged experimental

I have no idea where to go next with it, I cant seem to grasp the concept of what could cause the page scrolling up when the page is stripped from every js function.

Does anybody else run into this issue before? Any solution maybe?

0

There are 0 best solutions below