[Draggable rotation doesn't work until animation is completed]

Hi Zach, thank you very much for pointing out what is causing the bug!
I was able to make this work and still look half-decent. I wrapped container2 in div with position: relative, then pulled out draggable element with position: absolute just above conatiner2 so it looks like
div relative
  .draggable absolute

  .container2 fixed

 

it's a bit hacky but it works.

Thank you once again and I'm looking forward to use GreenSock scroll plugin. Wishing you guys best of luck while developing it! Have a nice day

 

[Draggable rotation doesn't work until animation is completed]

Hello,

I have following setup:

 

let tl = new TimelineMax();


tl.from('#draggableElParent', 1.5, {

   opacity: '0'

}, "-=1.5")


let scene = new ScrollMagic.Scene({

         triggerElement: '.container',

         triggerHook: 0,

         duration: "400%"

      })

      .setPin('.container')

      .setTween(tl)

      .addTo(controller)


const drag = Draggable.create("#draggableEl", {

        type:"rotation",

        bounds:{ minRotation:0, maxRotation:180 },

        onDrag: function(){

            // this won't work until animation is finished
        }
    })

The problem is I can't rotate this #draggableEluntil scene animation is finished. Is this bug or a problem in my configuration? It seems like only rotation doesn't work until animation is finished

Here I reproduced my problem:

 

See the Pen OJypqOQ by darklaki (@darklaki) on CodePen