Ползунок GSAP, уничтожить временную шкалу при изменении размера и повторной инициализации

http://codepen.io/TPDBrendan/pen/xgwWwM

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

Я уже выполнил основной эффект - экран разделен пополам по вертикали, каждая сторона имеет временную шкалу, которая вытирается к центру, показывая слайд внизу, который одновременно скользит к центру. Правая сторона намеренно задерживается. Если вы загрузите кодовую ручку и не измените размер, вы поймете, что я имею в виду.

Изменение размера окна бросает мне кривая, все же. Я установил отклоненные функции, чтобы убить 2 текущие временные шкалы, а затем перестроить их снова с новыми размерами области просмотра с измененным размером. Он получает новые размеры окна и устанавливает новую временную шкалу с этими спецификациями успешно, но изменение размера несколько раз показывает, что он не должен убивать старые временные шкалы и просто создает несколько копий с каждым размером области просмотра.

Я хотел бы иметь возможность сохранить ход текущей временной шкалы перед ее уничтожением, а затем инициализировать новую, измененную по времени шкалу для этой точки прогресса, чтобы для пользователя она выглядела как одна анимация, которая немного останавливается при изменении размера. Также было бы здорово, если после завершения анимации изменение размера окна не сможет инициализировать другую временную шкалу, поэтому оно может опираться на последний слайд. Но пока просто понять, как решить проблему с дублирующимися временными рамками, было бы здорово!

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

function resizeLead(){
   prog1 = tl.progress(),
   prog2 = tl2.progress();
   tl.seek(0).kill();
   tl2.seek(0).kill();
}

function resizeTrail(){
  windowSize[0] = $(window).width();
  windowSize[1] = $(window).height();
  buildTL();
}

0 ответов

Другие вопросы по тегам