Im thrilled to try out all the new vector animations in hype. I want to create a homepage where you start scrolling down and after lets say half a page start scrolling to scroll the timeline where an animation is revealed, after the animation I want the page to continue scrolling down.
Is that possible? All the best. And hope to get some insight from you guys
Check this document
Thanks Max!
This is quite exactly what I want to achieve… I’ll just try to figure out how to implement the code in my projects. Also, would it be possible to have some other elements that are closer to the viewer in Z space when scrolling down with this technique?
All this does is fix an Hype document for a certain scroll range and play it’s timeline. So it’s up to you what the animation does. Remove the dummy code for preview and deploy it on a page as a “widget”. It is not meant to take over the whole page. You can embed multiple of these in theory.
Happy animating.
I (think I) have the exact same question as OP.
Usage is several animated/ interactive infographics inside a page that should be operated by scrolling up and down. On desktop with mouse and on mobile/ tablet with touch.
Is it possible to first scroll the page into the animation, then scroll within the animation, then scroll ahead on the page (i.e. not just trigger playing the animation)?
Also: “It should be used as a widget on a page built with regular HTML, Blog or CMS”.
Is the idea having several Hype animations on the same page, i.e. not go with scrolling from scene to scene inside Hype animation (which I still in itself was not able to figure out how to do)?
What is a widget here (what to export from Hype and how to put this inside the page)?
Sorry for my stupid questions here, but I am still having a very hard time figuring out how to use Hype in the context of web pages and making the animations work in a user friendly, modern way.
Making a standalone animation, putting it into a div and then interacting by clicking elements is simple.
Putting Hype export in context may be simple too, but I find it extremely, extremely hard figuring that out!
Such usage scenarios are becoming increasingly common now, the Hype update price is very steep and I so far cannot see how the new version makes the task easy.
Well that's the project. If you need another solution or have one in mind you would need to create another script. Out of the box you can't use a scrolling transition. Also the scrollbar would need to be managed if you don't want it reseting when scene height changes etc. But there are ways…
I found it much more convenient to let the browser manage and do the regular scrolling work and also I need stuff like this to be part of a bigger ecosystem like a CMS.
There are many ways to Rom!
I really appreciate your input, not just in this thread, thanks for that. It was not criticism towards this Hype project.
Not perceived as such at all. If my writing indicates that I am sorry.
Not a native speaker myself.