HaunGo

Dude.. scrollLeft is the answer! Thank you!

Hello... how can get this overflow-x to scroll with a nice flick ? and be bound to the overflowed container ? Could flexbox be part of the problem ? I've forked one of Diaco's pens from another post. Thank you for the help!

I thought there was a GSAP plugin for swiping and flicking ? good for mobile . Am I thinking of the Draggable plugin ? I just need to swipe/drag/and flick while that motion also controls a separate TimelineMax. Any thoughts or suggestions ? Also, I'm looking to do a bit of scroll hijacking.. so, if theres GSAP related solutions for that, I'd love to know! Thanks !

WOW.. who would need Smoke & Mirrors when you have a solid understanding of MATH & SCIENCE ?! Niiiiiice.

Instead of actually animating the line into a wave.. .. .. Have you considered using masking, and moving a static wavey line being masked? smoke & mirrors

Hello.. GreenSocked friends.. I just wanted to share this PEN CSS Mask / SVG Shape / GSAP / morphSVG http://codepen.io/HaunGO/full/ONYwBP/ Enoy

This is great dude! Thanks for posting this.. .. .. .. It tried to build this sort of thing over the weekend, but didn't follow through and finish it. Nice work!

Does anyone know of a good example of a ScrollSpy-ish being used with ScrollMagic and GSAP ? I've been working on a little something, but it's giving me some trouble. It works, but some numbers are hard coded.. and I really think there's a better way. I'm also working on a codepen of the very basics of it.. . but in the meantime, has anyone already created this sort of thing? Thanks,

Hey thanks for the simple, temporary, fix! I can definitely live with the 1 degree rotational difference.. I implemented it into my full project, and it DOES work. Great!

Hello.. I searched the forums for this, but didn't find anything.. .. I suspect is a known issue though. I'm working with SVG, trying to rotate (among other things) and it's not holding the rotation.. It DOES tween/animate, but it snaps back to the original position when not animating. I think it's related to the DrawSVG plugin. Here's a codepen: (be sure to compare Chrome/Firefox/Safari) http://codepen.io/HaunGO/pen/BNWQmq?editors=101 Thanks in advance,

This extension does not work with the latest version of Illustrator CC.

Thanks.. So, what do you think about this unofficial beta plugin? I found it through the post you shared. https://github.com/cjgammon/GreenSock-JS/blob/master/src/uncompressed/plugins/SnapPlugin.js or dive into SnapSVG? (never used it before) or use smoke and mirrors to fake the transition?

OK.. so If we need to animate a very simple shape, a vesica pisces, into simple circle.. .. Can GSAP handle that, or must we use something like SnapSVG.js? Specifically, I need to animate this shape into a perfect circle. (a solid shape with a fill, no stroke.) (They both have the same number of points.) Maybe a shape morphing plugin is in the works? MorphSVG? Thanks !

This works great Diaco THANKS ! Now, I'll figure out WHY it works.

Hello.. I'm having trouble finding a very basic swipe example.. .. I don't need to drag anything around.. .. I just need to listen to a swipe up or down and call the appropriate function. I've got a little something now based off of some examples, but again.. .. i end up dragging the stage round when I just want to listen for a swipe direction. Any suggestions? Here is my simple code: var DD = Draggable.create($("#stage"), { type:'y', lockAxis:true, onRelease:function() { var dir = this.getDirection("start"); console.log('swipe! onDragStart() ' + dir) if (dir === "up"){ next(); }else if(dir === "down"){ prev(); } } }); ALSO, I tried attaching it to the body, but the only direction that would log was "right". Thanks,

OK.. so If we need to animate a vesica pisces into a circle.. .. Can GSAP handle that, or must we use SnapSVG? Specifically, I need animate this shape into a perfect circle.

Ironically, the website for this svg injection plugin has a nice looking collision detection animation on their home page! https://useiconic.com/ They use this: http://famous-tutorial.meteor.com/

Petr & Carl, Thanks for replies! I'm a big fan and long-time watcher of BOTH of your tutorials, and I will definitely be referencing the tomato-hating tuts during development. I didn't think the GSAP Physics2DPlugin had collision detection.. I've used the AS3 version. That SVG injection look awesome.. I think I'll try that. This post might be useful: http://greensock.com/forums/topic/9013-pixel-perfect-collision-detection/ But it uses a <canvas> object, and I don't know if I can mix and match DOM and CANVAS elements.. (I don't know much about <canvas>) At this point.. I'm missing the Flash dev environment.. .. I could build this on the visual timeline in NO-TIME.. I wonder if I could use Adobe Edge for this? but i think it also exports into <canvas>? and it probably doesn't use GSAP anyway. I'm leaning toward faking the whole thing.. I've got a pretty good eye for animation and movement, but could definitely be tedious. I'll be starting the project next week, so I've still got some time for suggestions. Thanks, HaunGO

Hello Every One, I would like some advice from this community of experienced interactive animators! I've been tasked with a "simple" scroll-based animation. With the first part of it featuring simple collision detection of circular objects. I'm wondering if I should FAKE the physics with static animation, OR use some kind of simple 2D physics with collision detection. I'll be using ScrollMagic to control a TimelineMax sequence, animating with SVG elements. Here is a brief overview of the animation: About 10 circles of various sizes float in 2D space, bouncing off each other, and showing a stressed effect on impact. (This could either be sortof random, or hard coded.. this is what I'm asking advice on. ) After a few collisions, the scroll based animation continues.. Next, a few circles highlight and overlap instead of colliding.. THEN, the overlapping section highlights.. A ven diagram.. Then, that ven diagram (oval) shape is animated in some way.. I have TWO primary questions: Should I use .svg elements with the image tag: <img id="circle1" src="image.svg"> or as that big string of svg code? Should I FAKE the collision detection? or implement some sort of simple 2d physics engine w/collision detection that I don't know about? (is there a GSAP class for this?) ALSO, any general advise about how to execute this would be helpful. Thanks in advance! -HaunGO

Are there any handy cheatsheets available for GSAP / TweenLite/Max TimlineLite/Max ect ect.. ? It would be nice to see it added here in this list: http://overapi.com/

Thanks Carl, I don't really need it for flexible dynamic data.. it's for a conceptual animation. I will need the slices to animate as I add or remove their percentage though. I'll look around the Flash Den Gracias, -B

Hello.. Does anyone know of a good Pie Chart Generator Class? I bet there's a PieChart out there somewhere with GreenSocks! With animation transitions.. ? Thanks! -B

Excellent, thanks Jack

I work alot in Flash, and haven't tried anything for mobile yet.. Just wondering how the community is feeling about it.. How amazing is it? A list of known bugs? Things TO DO, and NOT To Do? Thanks,

The video is in place, for sure. It's even pulling the time/length of the video. I don't believe it's a GreenSock issue.. I REALLY think it's some server filetype permission settings. I've run into this sort of thing in the past, but it's been a long time. I do not have access to server settings. All I'm looking for here, is for someone to say.. .. "Yep, that would do it... it's the nature of the .mp4 bla bla bla secure server bla bla bla" before i send it to the back-end guys. (which i've already done, anyway.) I don't know who else to ask. Thanks,