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

Is it possible to avoid the "pop in" effect? #15

Closed
FallingSnow opened this issue Mar 12, 2017 · 7 comments
Closed

Is it possible to avoid the "pop in" effect? #15

FallingSnow opened this issue Mar 12, 2017 · 7 comments

Comments

@FallingSnow
Copy link

Is it possible to have the elements always in the DOM just hidden? That way they don't change the height of their parent element when the animate in.

@jljsj33
Copy link
Member

jljsj33 commented Mar 13, 2017

use tween-one

@jljsj33
Copy link
Member

jljsj33 commented Mar 13, 2017

 <ScrollOverPack id="page3" hideProps={{ 1: { reverse: true } }}>
    <TweenOne
      className="demo"
      animation={{ y: 0, opacity: 1 }}
      key="1"
      style={{ transform: 'translateY(100px)', opacity: 0 }}
    />
</ScrollOverPack>

@FallingSnow
Copy link
Author

Got the same result.

For example, notice how on https://react-component.github.io/tween-one/examples/group.html the black code box moves down when the page loads. I want to avoid that.

Am I doing something wrong, I'm using rc-queue-anim?

@jljsj33
Copy link
Member

jljsj33 commented Mar 14, 2017

Try appear: false?

@FallingSnow
Copy link
Author

Same result but now there is no animations. The elements just pop in.

@jljsj33
Copy link
Member

jljsj33 commented Mar 15, 2017

I will add a appear to OverPack...

@FallingSnow
Copy link
Author

I rolled my own component, thank you though.

@jljsj33 jljsj33 mentioned this issue Mar 21, 2017
4 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants