Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Rotate/animate on scroll #7

Closed
atJasonCarter opened this issue May 28, 2019 · 1 comment
Closed

Rotate/animate on scroll #7

atJasonCarter opened this issue May 28, 2019 · 1 comment

Comments

@atJasonCarter
Copy link

Ability to start rotation when you reach a specific point on the page, and end when you reach a second point on the page

@Stanko
Copy link

Stanko commented May 28, 2019

This is really easy to pull off, here, I made a live example:
https://codepen.io/stanko/pen/arjeNE

Code is really simple, listen to the scroll event, and rotate the scene when scroll is in certain range.

const minScroll = 100;
const maxScroll = 500;

window.addEventListener('scroll', () => {
  if (window.scrollY >= minScroll && window.scrollY <= maxScroll) {
    illo.rotate.y = Zdog.TAU * (window.scrollY - minScroll) / 1000;
  }
});

You might want to tweak it for your purposes, but that is the general idea.

P.S. I think that shouldn't be part of Zdog library, as it just adds feature bloat.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

2 participants