mimeartist

Sorry for not supplying a codepen... I'll give the kill() a try... I've got a load of images that you can drag around... but when they're enlarged they're only allowed to drag in one direction, so I was looking for a way to turn off one of the axis... but I'm doing a whole load of other stuff going on too, so I think kill will be best, as mutlipurposing the divs is a bit of a headache (for me anyway) Thanks Jack! James

PS If I start using draggable with type: 'x' do I need to change my TweenMax calls to x rather than left?

Sorry... should of made more sense... how do I change on the fly a draggable that was in both directions, and then just set to one axis? in fact is there a way of removing all the draggable features, and then applying new ones, concerned that applying a draggable twice might start to cause issues?

I have a div that is draggable in all directions, what's the best way to alter it so that it is only draggable in one axis? e.g. going from type: 'left, top' and change it to just type : 'left'?

Thanks for your help the both of you. I'll always go for the 'maths' version, as at least I can see logically something will work 'hopefully' across browsers... Thanks for the codeine I'm actually going to see if I can not move the mesh, and just animate the images below it.

I've got some images that I'm animted that have a mesh type graphic layered over the top, as the tweens occur they tend to shimmer / moire... is there a way of using a tween with a rounding to the nearest nth pixel... e.g every 4th pixel for example?

So... Draggable.get('#slide' + theBounder).applyBounds({minX:-1000, maxX:10000, minY:-1000, maxY:10000}); Seems to work... I'm assuming this won't have any performance impact... I know what you're saying about just turning off the 'draggability', but this easier than keep track of which ones to turn on and off... as the animating them offscreen was getting screwed up by the bounds somehow.

Trouble is the site is too complicated to make a simple Codepen... sorry... So I'm assigning this now when the user starts to drag Draggable.get('#slide' + theBounder).applyBounds("#siteContainerInside"); is there a way to turn off bounds after onDragEnd? guess I could set a bounds that is much bigger than the webpage, but just wondering if there is a way to remove it?

Is there a way of only using the bounds when an item is being dragged... I'm trying to animate items off screen, and when I start to animate them, if they're already offscreen they arrive into the div they're bound to... but I only need them to stick to the bounds when dragging. Hope that makes sense!

Ignore this... worked it out... with a comma and a space! TweenMax.to('#slideInside3, .projectBodycopy', 0, {color:myFG});

I'm assuming that to change the color of a load of classes, it is best to identify the div they're in, rather than traversing the whole DOM I'm trying to adjust all the items with class '.projectBodycopy' within the div named '#slideInside4' Is there a simple notation with jQuery I should be following? TweenMax.to('#slideInside3.projectBodycopy', 0, {color:myFG}); Thanks, James

Thanks Jack, I just googled this, and found my own question... Thanks for answering it! Happy Thanksgiving! James

Thanks Diaco, Actually fixed it as I was outputting the style sheet via php, and was putting a semi colon on the end of each style, so it was breaking the next style, and importantly the one I was looking at in my tests!

I'm tryiing to use draggable and scrollTop for some scrollbars, but it seems to only be taking the style for the whole page even though I'm assigning styles to the divs I'm setting as draggable... how do i assign them on a div by div or class basis? ::-webkit-scrollbar-thumb { border-radius:0; background:#666666; } .aboutScrollStyle::-webkit-scrollbar-thumb { background:#FFFFFF; }; .peopleScrollStyle::-webkit-scrollbar-thumb { background:#FFFFFF; }; Thanks, James

If I've got 10 items all of the same class... and use contactDrag = Draggable.create(".contactSheetSquare", {type:"top, left", throwProps:true, dragClickables:true, edgeResistance:0.9, onDragStart:function() { doDrag(this); } }) How do I get the id in the function doDrag... it doesn't seem to want to grab it?

I'm an idiot. Thanks! Was trying it in different orders and all sorts!

I'm trying to get something to animate one way, and then back the other way... by calling the function that the call was in originally... but just not working, as you can see I'm decreasing the angle each time (albeit to the negative each time) http://codepen.io/anon/pen/jHrze What am I doing wrong? The reason I want it as a function, is that I'd like to just call various flags whenever I want (the proper version will use an array of values) but trying to keep it simple for the code pen

Thanks Rodrigo, Sorry I haven't replied sooner... I thought I was being notified when a reply came in, but just saw this by chance... will have a look and see how I get on James

I've got a tween of a flag... TweenMax.fromTo('#flagImage'+ whichFlag, theSpeed, { rotationX:20, transformOrigin:"left top" },{ rotationX:-20, repeat: -1, }); } Which basically flaps backwards and forwards... is there a way of amplifying the rotationX so that the tween still continues... but I can increase it by a factor, e.g. double it when I need to? or intact tween that value of rotation X, so it slowly goes from tweening rotationX=20 to rotationX=60 for example? James

Hi, I'm using edge resistance with the bounds set to the position of the draggable item, so i can move them just a little, and then they'll spring back into position. One thing I want to do is move into the Y position more than the X, is it possible to have edge resistance different for each axis?

Ah okay... yep thats what I'm trying to do... so .progress is my friend... thanks!

Not sure if this is going to make sense, but I've got a set of panels that animate onto screen and then back off again to determined places... and the client says they are too wizzy... So what I want to do is just show the last few frames of them moving into place but still look like they come from there original point as I'm quite happy where they appear to start from. E.g. they just appear on screen and then carry on moving very slightly to a stop Does that make sense... I'm not sure if I should use timeline or there is something in TweenMax I can do to create it

Thanks for this, that last post by Carl has been very useful.

Wow... thanks for these... will give it a whirl and let you know how I get on. I'll need to have it working on lower versions of IE so probably will have to try the trigger route.

I've got a draggable background, but it needs to have an transparent layer of small dots (which I'm using a transparent .png for) over the front that don't move... I know this isn't strictly a gsap issue... but is there a way to drag a div that is below a div you don't want to move?