Непрозрачность не найдена: 0 элементов в ScrollMagi c и gsap с React - PullRequest
Новая
       76

Непрозрачность не найдена: 0 элементов в ScrollMagi c и gsap с React

0 голосов
/ 26 марта 2020

Я использую ScrollMagi c и Gsap в проекте с React. У меня есть элементы, которые должны оставаться скрытыми, пока они не начнут свою анимацию. Но когда вы загружаете страницу, они кажутся видимыми, и пока вы не совершите полный тур, у них не будет свойств, которые они должны иметь. Почему? 

const Main = () => (
  <StyleMain>
    <Controller>
      <Scene triggerHook="onLeave" duration={10000} pin>
        {progress => (
          <div className="section-header">
            <Timeline totalProgress={progress} paused>
              <Tween from={{ opacity: 0 }} to={{ opacity: 1 }}>
                <h1>¡Bienvenido!</h1>
              </Tween>
              <Timeline
                target={
                  <div>
                    <p> Lorem suabnaiuaniuaniaaibaibagyvahbahab,</p>                   
                  </div>
                }
              >
                <Tween from={{ opacity: 0 }} to={{ opacity: 1 }} />
              </Timeline>

// THIS ELEMENT 

              <Timeline
                target={
                  <div className="profile">
                    <img src="../images/photo.png" alt="I" />
                  </div>
                }
              >
                <Tween from={{ opacity: 0 }} to={{ opacity: 1 }} />
                <Tween
                  from={{ opacity: 1 }}
                  to={{ opacity: 0, display: "none" }}
                />

Большое спасибо за помощь

...