Trigger an animation at a specific scrolling height (nor set in percentage neither based on a trigger element)

I find that triggering an animation based on when page scrolling reaches a certain percentage of the page height is not very accurate as this means that the animation would start at different moments for pages of different heights — 10% of let’s say 2000px is scrolled away quicker and earlier than 10% of …5000px : this would be stylistically unacceptable in the case for example of shrink/grow header animations where website pages have different height — as they most certainly would.

I wonder whether assigning a ‘scrolling into view’ animation to a trigger element is a good method given that that element might not be there in all the pages.

My questions:

  1. I understand it is NOT possible to rely on px height to trigger the animation start, correct ?

  2. This would be possible with css out of Webflow, correct ?

  3. if 1) is correct, is there a way to make an animation start at the same chosen scrolling moment in all pages without recurring to not semantic ad hoc HTML tags?

  4. would inserting a trigger HTML element just for the sake of the animation — like an empty div — be somehow a bad practice ?

Thank you all.