Style over content, and the presentation just plain getting in the way of the information, to the point that the user ends up leaving rather than finding out what the site is attempting to convey.
Awful. Just awful.
Style over content, and the presentation just plain getting in the way of the information, to the point that the user ends up leaving rather than finding out what the site is attempting to convey.
Awful. Just awful.
This was not within reason.
LineageOS[2] has a site with a decently readable source code. They also don't have exactly what you are looking for, but the <img> with id="rotate-on-scroll" (The spinning phones) and the related script[3] look like they could somewhat related -- you could probably change the transform in the script to accomplish what you're looking for.
[0] https://www.w3schools.com/w3css/
[1] https://www.w3schools.com/w3css/tryw3css_templates_parallax....
[3] view-source:https://lineageos.org/ (lines 1247-1263)
Achieving the parallax seems to be easy enough, but combining it with all these aminations seems a bit more tricky. The animations are more complex than animate.css's approach of just animating when the component is displayed - you can play the animation in reverse by scrolling up rather than down.
I've seen the New York Times and BBC produces stories told in that parallax / animated type way and it's very effective. I'm guessing therefore that they use a standard parallax approach and them one or more animation libraries together; I was hoping there was one neat library that brought it all together but maybe that's asking for too much.
Also, I wasn't even sure if I should have expected a "Specifications" section, which was the reason for me to scroll all the way down to the end.
Absolutely horrible.
I am curious what they've used to achieve the endless scrolling type parallax. A while back I looked for libraries to achieve this and didn't find anything other than fullPage.js which doesn't seem to have an option for this (only full page transitions).