Анимировать / создать сцену в закрепленной сцене - PullRequest
Новая
       12

Анимировать / создать сцену в закрепленной сцене

0 голосов
/ 22 декабря 2018

Я прочитал несколько примеров, но не нашел работающего.

В основном пытаюсь закрепить div и сделать так, чтобы дочерние div внутри него анимировались, пока пользователи прокручивают, и pin будет освобожден.как только все дочерние элементы завершат анимацию.

Вот что я пытаюсь, однако анимация прозрачности .setTween не работает. 

<div id="pinned-scene">
  <div class="scene" id="scene1">Scene 1</div>
  <div class="scene" id="scene2">Scene 2</div>
  <div class="scene" id="scene3">Scene 3</div>
  <div class="scene" id="scene4">Scene 4</div>
  <div class="scene" id="scene5">Scene 5</div>
</div>

// pin scene
new ScrollMagic.Scene({duration: 1000, triggerElement: "#pinned-scene"})
.setPin("#pinned-scene")
.addTo(controller);

// animation scene
new ScrollMagic.Scene({triggerElement: "#pinned-scene", offset: 200})
.setTween("#scene", {opacity: 0.5})
.addTo(controller);
...