Scrollmagic проблема с прыжком при удалении закрепленной сцены - PullRequest
Новая
       38

Scrollmagic проблема с прыжком при удалении закрепленной сцены

0 голосов
/ 15 мая 2019

Мое намерение:

1) сцена булавки на пути вниз

2) не булавка или анимация на пути назад

3) возобновление булавки и анимацииесли пользователь затем прокручивает обратно вниз.

У меня есть две закрепленные секции на странице - секции, которые прикрепляются к верхней части экрана, когда достигают вершины области просмотра в течение заданного времени - но я нехотите, чтобы пользователь проходил анимацию в обратном направлении на пути назад на страницу.

Установка реверса: false не решает эту проблему - проставка все еще на месте, и пользователь должен прокручивать пробел, что еще хуже!Я переместил настройку сцены в функции, чтобы можно было повторно инициализировать сцену один раз, если пользователь прокручивает страницу вверх, а затем снова возвращается вниз. 

var animateScene = new TimelineLite()
  animateScene.to("#animateScene", 1, {x:'-80%'})
   .to(".progress-bar", 1, {width:"100vw"}, 0);

function initScene() {

 var scene = new ScrollMagic.Scene({
   triggerElement: "#scene",
   triggerHook: 'onLeave',
   duration: 4000,
   tweenChanges: true,
   reverse: false
 }).setPin("#scene").setTween(animateScene).addTo(controller);

 scene.on("end", function(){
     scene.remove();
     scene.removePin();

   $('.progress-bar').addClass('complete');
   resetScene();
 });

 }

function resetScene() {

 var sceneProgress = new ScrollMagic.Scene({
   triggerElement: ".complete",
   triggerHook: 'onEnter'
 }).addTo(controller);

 sceneProgress.on("leave", function(){
   sceneProgress.remove();
   $('.progress-bar').removeClass('complete');
   animateScene.time(0);
   initScene();
   });

  }

   initScene();

Этот код работает, но что происходитздесь, как только анимация закончится, проставка удаляется, а страница затем переходит на дно - я думаю, на расстоянии удаленной проставки, что выглядит ужасно - из-за убранного места.

Может кто-нибудь указать, где я иду не так?

...