[Loading gsap inline]

thank you so much to both. It's always in the details. I was missing the css plugins

 

I will only use a tweenlite since I want the extreme minimum to load.

 

Danny

[Loading gsap inline]

I am trying to load the lightest version in greensock to animate element on load. The best way would be timelinelite.min to be put in head inline so the javascript won't render block on,load but only an external tweenmax.min.js is working. I always have a undefined tiemlinemax or lite when I am not using tweenmax.

 

I just want to inline the timelinelite with the animation in the head after i will figure out which plugins to use

 

Thanks

Danny

See the Pen WXZmxO by dominium (@dominium) on CodePen

[On-Off-onclick same element]

Thanks Carl no you did understand, thats exactly that.

 

More a javascript question

 

I thought that some tween playback would do the job. Still have to wrap my head around all that.

 

Learning curve is long.

Danny

[On-Off-onclick same element]

Hello Guys,

 

I know that should be easy for you to resolve that.

 

I have tried a lot and I'm getting better and better having fun learning GSAP

 

I want to animate the same element for mouseover, mouseout and click.  The click state as you probably already know is the difficult part.

 

I tried some playback method with kill...etc..

 

The "on" state is play and reverse on "off" but I dont' get what to use to kill and play another tween for same object.

 

I am using the scrollto plugins.

 

BAsically My overlay is autoalpha 1 onmouseover and 0 onmouseout but if the user click it should stay visible for 1 second which is the same time for the scrollto finish

 

 

Viva codepen to describe it

 

Thanks

 

Danny

 

 

 

See the Pen aLooBM by dominium (@dominium) on CodePen

[controlling timeline within function]

Yes thanks,

 

I already saw every example of scrollmagic. I will have more section on the site. this is only the intro.

 

It's already working Like I want without using the function. But using it seem to get the code more concise.

 

I still have a lot to learn. I just want to be able to use the property of gsap with a timeline within a function. But m just complicated things. I want this site to run smoothly because it will be overloaded with action!

 

love your api and it's gsap I need to learn not scrollmagic(Only for triggering)

 

This is the no smooth version of what I want to accomplish in a more pro ways using function.

http://ericamedium.com/old/index7.html

hope this is not considering like spam, will edit it after

 

Thanks so much and I will try to figure out all the gsap code example I gather from all over to manage to do a pure gsap website piece of art

[controlling timeline within function]

Yes i already saw that example.

 

The two first TL should pause on scroll. I put the pause() in the on"enter" event of the scene, introcomplete.progress(1).pause();

 

See the Pen GregYJ by dominium (@dominium) on CodePen

 

Thanks

[controlling timeline within function]

Hello,

 

I should maybe do a codepen but I have a lot of code. I already tried all the exemple in the forum and none are working. Maybe missing something.

 

I know I can do this without the function method but the pros use this for some more reliability, I think!

 

I basically have 3 timeline that is returned within 3 different function. On on intro, one when intro is completetl and another should start when the user scroll down. I want to kill the introtl and pause the completetl on the starttl or kill introtl and the completetl. Doesn't matter the point is I can't figure how to be able to control the TL within the function.

 

ALready tried this one by creating a master timeline.

 

function pause(){
    var tl = new TimelineMax({paused: true})
        .add(introtl())
        .add(completetl());
};
var introcomplete = pause();

 

 

pause();

 

Should said that i am using scrollmagic to target the timeline.

 

Please all the help i can have on this simple task for a pro.

 

I'm still a one year old baby in the tween/html/css world.

 

Thanks so much

[how to force a timeline to finish]

perfect!

 

I get it. progress with the 1 stands for 100%.

 

Too simple! When you know it

 

Thanks

[how to force a timeline to finish]

Hello Jack,

 

Yes I found a quick solution from one of your post. I didn't really want to kill the tween but to cancel it for later use. Did you know a quick one to resurrect it. Hahahaha unkill it.

 

Thanks

love your GSAP!

[how to force a timeline to finish]

got it

 

yourTween.totalProgress(1).kill();

 

Now how do I close this post?

[how to force a timeline to finish]

I have not made a codepen.

 

It's basically that.

 

I want to know how I can force the timeline to finish animating to the end or beginning. Just want the elments to return to the initial state without tweening while scrolling using scrollmagic or basically to press a button.

 

I have tried pretty much all the timelinemax methods without success.

 

somebody here with much experience then me should know.

 

Thanks so much