Jump to content
GreenSock

Johnny

Members
  • Posts

    3
  • Joined

  • Last visited

Posts posted by Johnny

  1. Ahh yea - that was pretty dumb for me to use that in the example, shouldn't use jquery width on a render frame indeed. 

     

    By any means, still seeing a performance difference for some reason. Quite odd. I will try to get a codepen together, in this case we were able fall back to native scrolling just for iPad.

     

    Great that you're using Myburger in your seminar! I'll mail you our latest work in a couple weeks - it has tweenmax and three.js all over it :)

     

    Thanks a lot!!

  2. Hello!

     

    So this issue is related to http://forums.greensock.com/topic/8221-infinite-draggable/.

     

    I'm trying to create a carousel that can loop. This was proving fine with a "placeholder" DOM element, because I can simply assign the placeholder DOM element with Draggable and do the loop magic within the update callbacks to the actual carousel container.

     

    However, on iPad we have discovered that using this method causes the motion to noticeably stutter when grabbing the coords from the _gstransform object and passing them through via the onUpdate callback to the actual carousel container. But, if we pass the actual container of the carousel into Draggable.create instead of the placeholder DOM element - it immediately removes the stutter on iPad 2 and 3. I know you use requestAnimationFrame for this, so I'm not sure why this is the case.

     

    So... I removed the placeholder element and passed the carousel DOM element to Draggable.create. I tried something like this instead where onUpdate is being called with both 'onThrowUpdate' and 'onDrag' and I catch the current X position and try to set the carousel container to the loop point.

     

    Although, it seems the position I set is overwritten  on the next render cycle (which I guess would make sense) because it has no effect:

     

    this.onUpdate = function( e ){
        var itemsX = this.$draggableEl[0]._gsTransform.x;  
        if (itemsX > 0 && this.loopDirection != -1)
        {
            var tx = -this.$draggableEl.width() + itemsX + (this.itemMargin);
            this.loopDirection = -1;
            TweenMax.set( this.$draggableEl, {x: tx } );
        }
    }

    Can I do this somehow without using a proxy or null object that passes the coords? Because it runs silky smooth on iPad by passing the actual DOM element to Draggable.create. Just need that loop functionality.

     

    Anyways, thanks for an awesome library - and also for tweeting the McDonald's Myburger project. Draggable and throw props saved me on that project ;)

     

    Johnny

    cartelle.nl

  3. Hello!

     

    I'm loving the new draggable component - works great. I have a full-bleed infinite wall that is draggable with no bounds. I see that dragResistance effects how much the content will move in respect to your mouse movement, and by setting it to zero the content will move the content the same distance as your mouse delta. This is as expected, but what I'm looking for is how to keep it the draggable content move a distance 1:1 (dragResistance:0), but have the content follow the mouse slightly behind to give it a slightly softer responsiveness. How can this be achieved?

×