FAQ Database Discussion Community


How does jQuery Slidedown get final height of hidden item before showing it?

javascript,jquery,greensock,gsap
I'm trying to replicate jQuery slideDown() in GSAP and I'm having trouble working out how jQuery calculates the height of an item which is currently hidden as if it was set to height:auto. I've tried trawling the code on GitHub but can't find any code which seems to be doing...

TweenMax: multiple elements with sequential variables

greensock,tweenmax,gsap
is there a way to do something like +1 for delays when tweening an array / object collection? Let's say models includes 5 elements and I want to show them sequentially with a difference of .2 seconds after at least 1 second delay. Normally I'd do an for / $.each...

Fire multiple tweens simultaneously with GSAP and TweenMax

javascript,jquery,greensock,tweenmax,gsap
I want to move away from jQuery for animation so I have been using GSAP. I am trying to figure out how to fire multiple animations on an element and its children. Basically I want to give the #navicon a "720 cork" effect which is working fine and a fade/toggle...

Pixi.js: How is this complex series of position/alpha/scale numbers generated?

javascript,canvas,greensock,pixi.js
Can anyone explain how this file was generated, what is was made with? It's a huge amount of y position, alpha and scale points, one for each frame, for animating sprites on the pixi canvas. Some elements have maybe 800 position points? I'm thinking each y point was not typed...

GSAP timelineMax error, cannot read property 'repeat' of undefined

javascript,greensock,gsap,scrollmagic
I'm trying to create a simple timelineMax with GSAP and scrollMagic, I'm getting the following error. Everything looks right to me so I'm not understanding this error. Uncaught TypeError: Cannot read property 'repeat' of undefined d.to @ TweenMax.min.js:14 (anonymous function) @ app.js:12 Line 12 is .to("#parallax1 > div", {y: "80%",...

GSAP tween not working correctly. Set duration has no effect

javascript,jquery,animation,greensock,gsap
I am trying out the GSAP animation library. According to the basic docs the syntax for getting a tween up and running is: TweenLite.to( [target object], [duration in seconds], [destination values] ) So I have tried a really simple tween based on jQuery's hover event: $('.contact-item').hover(function(){ TweenLite.to(this,4,{background:'#671B4B'}); },function(){ TweenLite.to(this,4,{background:'#FFFFFF'}); });...

GreenSock - after animation links are not clickable in Chrome

jquery,css3,animation,3d,greensock
Have very strange behaviour that is not working only in Google Chrome but works in Firefox. I have a cube with only side pages (without top and bottom) - so I have 4 pages and I rotate them for 90 degrees left and right. Here is the the LIVE example...

Keep text smooth whilst animating

css,greensock
I am using the Greensock library to animate some text. It all works fine except that while the animation is progressing the characters become very pixelated. This effect disappears one the tween is complete. I am trying to find a way to keep the text smooth throughout but can't make...

How to convert Greensock's CustomEase functions to be usable in CreateJS's Tween system?

createjs,tween,easing,greensock,easing-functions
I'm currently working on a project that does not include GSAP (Greensock's JS Tweening library), but since it's super easy to create your own Custom Easing functions with it's visual editor - I was wondering if there is a way to break down the desired ease-function so that it can...

how to tween a number of objects in as3 using greensock?

actionscript-3,greensock,tweenlite
I need to make an animation with numerous objects (around 500) flying from left to right, with different delay, duration and destination. However I need to run another function once all the objects have been already arrived at their destination. I have tried to make an loop check every time...

put canvas in custom div?

three.js,html5-canvas,greensock
I started developing from an example that shows to integrate three.js + greensock. Link: http://www.kadrmasconcepts.com/blog/2012/05/29/greensock-three-js/ I am trying to put canvas used by three.js + greensock to a div inside my page designed. But canvas always gets appended to bottom of screen. I tried to do getelementbyid and access my...

AS3 How to Reset A Tween on MouseOut of target mc?

actionscript-3,flash,greensock
In this example I have 3 panels, inside a mc called "panelHolder". Goal: To be able to have only the bgr color in the "bgr" mc (panelHolder.panel1.Bgr) tweened to a different color when the mouse is over the target mc expanding, and then reset when the mouse is over one...

ScrollMagic and TweenMax Automatically executes

javascript,greensock,tweenmax,gsap,scrollmagic
Hey all Im trying to wrap my head around all this, been playing with it all day. What I'm trying to accomplish is have a background image zoom in (and eventually become transparent through opacity) when the user scrolls down. I've got one half of the desired effect working but...

How to adjust a Greensock.js tween based on browser scroll y position rather than by the time?

javascript,tween,greensock
How would I go about adjusting the time manually based on the scroll position? What might that look like? To basically 'scroll' the tween? So that the tween reacts to the scrolling mouse's Y position rather than just trigger and execute based on a preset time?

Animation (bound to scrollTop) only finshes when I stop scrolling

javascript,jquery,greensock,tweenmax,gsap
My animation event nearly pauses or lets say gets significantly slower at completing when scroll reaches more than 15 percent. Why is that? If should animate to the left but instead it does so only when I stop scrolling. $(window).scroll(function () { var content_height = $(document).height(); var content_scroll_pos = $(window).scrollTop();...

GreenSock GSAP: Multiple eases for different attributes?

javascript,animation,greensock,gsap
I have an element animating from the top-left corner to the center of the screen: TweenMax.to($("#char"), 1, {top: "50%", left:"50%", ease:Power1.easeOut}); This animates in a straight line, with some easing. What I want is a more circular animation that follows this path: so I have to use multiple TweenMax.to() calls,...

ActionScript 2 - Get MovieClips' initial position and save it for each mc for later target position

loops,position,actionscript-2,movieclip,greensock
I am working on an animation in AS2 which requires that all text MovieClips (instance names starting with "txt_") will be manually placed initially on stage and I need to store their own initial placed positions (x,y) so they will be retrievable later when I want to animate them to...